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

　　

????????1、預(yù)先定義好圖片顯示的標(biāo)準(zhǔn)寬度和高度。
????????2、如果圖片的大小超過(guò)了標(biāo)準(zhǔn)定義，那么等比例壓縮圖片。
????????3、如果圖片的大小等于標(biāo)準(zhǔn)定義，那么按照標(biāo)準(zhǔn)寬度和高度顯示圖片。
????????4、如果圖片的大小小于標(biāo)準(zhǔn)定義，那么不對(duì)圖片進(jìn)行任何壓縮處理。

?

<script language="JavaScript"> //圖片按比例縮放 var flag=false; function DrawImage(ImgD,iwidth,iheight){//參數(shù)(圖片,允許的寬度,允許的高度)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> 調(diào)用： <img src="images/toplogo.gif" οnlοad="javascript:DrawImage(this,100,100)">

?

?轉(zhuǎn)：http://www.verydemo.com/demo_c98_i16948.html

轉(zhuǎn)載于:https://www.cnblogs.com/yiwd/archive/2013/06/08/3126685.html

總結(jié)

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

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。