js等比例缩小图片尺寸的例子

发布时间:2019-12-06编辑:脚本学堂
本文介绍了js等比例缩小图片尺寸的方法,用js实现图片尺寸的等比例缩小,图片等比例缩放的实现方法,有需要的朋友参考下。

有时需要控制图片的宽度,考虑到html页面解析顺序可能导致的一些问题,决定通过定义一个简单的功能函数,然后在img元素中添加onload事件来调用的方式进行实现,就会用图片等比例缩放的js代码
考虑用js实现等比例缩小图片的尺寸。
1,js部分
 

复制代码 代码示例:

<script type="text/javascript">
 function changeimg(objimg)
 {
     var most = 690; //设置最大宽度
     if(objimg.width > most)
     {
         var scaling = 1-(objimg.width-most)/objimg.width;   
         //计算缩小比例
         objimg.width = objimg.width*scaling;
         objimg.height = objimg.height; //img元素没有设置高度时将自动等比例缩小

         //objimg.height = objimg.height*scaling; //img元素设置高度时需进行等比例缩小
     }

 }
 </script>

2,html调用部分
 

复制代码 代码示例:
<img src="" onload="changeimg(this);" />