在Web上顯示圖片，通常都會有圖片顯示比例問題，如果不給<img />限制width和height，那么如果圖片大了就會將整個頁面擠亂，圖片小了又會使圖片失真。

　　

????????1、預先定義好圖片顯示的標準寬度和高度。
????????2、如果圖片的大小超過了標準定義，那么等比例壓縮圖片。
????????3、如果圖片的大小等于標準定義，那么按照標準寬度和高度顯示圖片。
????????4、如果圖片的大小小于標準定義，那么不對圖片進行任何壓縮處理。

?

<script language="JavaScript"> //圖片按比例縮放 var flag=false; function DrawImage(ImgD,iwidth,iheight){//參數(圖片,允許的寬度,允許的高度)var image=new Image();image.src=ImgD.src;if(image.width>0 && image.height>0){flag=true;if(image.width/image.height>= iwidth/iheight){if(image.width>iwidth){ ImgD.width=iwidth;ImgD.height=(image.height*iwidth)/image.width;}else{ImgD.width=image.width; ImgD.height=image.height;}ImgD.alt=image.width+"×"+image.height;}else{if(image.height>iheight){ ImgD.height=iheight;ImgD.width=(image.width*iheight)/image.height; }else{ImgD.width=image.width; ImgD.height=image.height;}ImgD.alt=image.width+"×"+image.height;}} } </script> 調用： <img src="images/toplogo.gif" οnlοad="javascript:DrawImage(this,100,100)">

?

?轉：http://www.verydemo.com/demo_c98_i16948.html

轉載于:https://www.cnblogs.com/yiwd/archive/2013/06/08/3126685.html

總結

以上是生活随笔為你收集整理的JAVASCRIPT 等比例缩放图片 限定最大宽度和最大高度的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。