JavaScript等比例缩放图片控制超出范围的图片_javascript技巧

js等比例缩放图片，这个功能非常实用，当网页加载一个尺寸比较大的图片时，往往会把一个网页撑的变形，页面变得很难看，于是我们就想到了用JS去控制超出一定范围的图片，脚本之家以稳定页面布局，本代码段就是完成了此功能，而且代码非常简洁，效果很好。

复制代码 代码如下:

<script>function <BR>DrawImage(ImgD,iwidth,iheight){ //参数(图片,允许的宽度,允许的高度) <BR>var <BR>image=new Image(); image.src=ImgD.src; <BR>if(image.width>0 <BR>&& image.height>0){ if(image.width/image.height>= <BR>iwidth/iheight){ if(image.width>iwidth){ <BR>ImgD.width=iwidth; <BR>ImgD.height=(image.height*iwidth)/image.width; <BR>}else{ <BR>ImgD.width=image.width; <BR>ImgD.height=image.height; <BR>} <BR>}else{ <BR>if(image.height>iheight){ <BR>ImgD.height=iheight; <BR>ImgD.width=(image.width*iheight)/image.height; <BR>}else{ <BR>ImgD.width=image.width; <BR>ImgD.height=image.height; <BR>} <BR>} <BR>} <BR>} <BR></script>
src=http://www.jb51.net/uploadfile/2013/0803/20130803034531502.jpg"
alt="自动缩放后的效果"

width="100"

style="max-width:90%"

onload="javascript：DrawImage(this,80,80)"

/>