用 JavaScript 讓圖片自動縮放大小

用 JavaScript 讓圖片自動縮放大小(二)

下圖原始圖檔 pic01.jpg 尺寸為 600 X 450
使用 JavaScript 程式後，便可將此圖檔依據你的需要自動縮放此圖片尺寸。
本例我設寬度為 400 Pixel，高度自動變更為 200 Pixel。
你也可以在此圖檔上使用滑鼠右鍵，選擇內容，查看你伸縮過的尺寸。
優點：輕鬆達到自動縮放圖片，符合自己所要的尺寸。

如果圖檔語法內不加入 onload="javascript:ResizeImages();"，原始圖的尺寸會以等比率顯示顯示，400 X 300 Pixel。

使用 JavaScript 程式如下：

<HEAD>
<script language="JavaScript" type="text/javascript">
<!--
function ResizeImages()
{
var myimg,oldwidth; 
var maxwidth=400; //縮放寬度設定值
for(i=0;i  maxwidth)
{ 
oldwidth = myimg.width; 
myimg.width = maxwidth; 
myimg.height = myimg.height * (maxwidth/oldwidth); 
} 
} 
}
//-->
</script>
</HEAD>
<BODY>

<img src="pics/pic01.jpg" border=0 onload="javascript:ResizeImages();" alt="這是自動縮放後的圖片效果">

本報導資料來源：零下一度

請按瀏覽器的檢視原始碼查看