后世的我今生的你
您的位置: 后世今生 > 技术文档 > JS控制图片等比例缩放(前台显示效果)很实用的哦!

JS控制图片等比例缩放(前台显示效果)很实用的哦!

   最近在做一个网站的时候列表页用到图片等比例显示的问题,由于是列表页就要考虑到多个图片了!之前写过一个“js图片自适应大小,使用js控制图片显示大小”也是js控制图片缩放的,可是之前那个控制的是一个图片的,而现在需要的是多个图片,不想自己整了就在网上找到一个不错的代码,可以很好的防治图片变形;收留下分享于此!

 

function AutoResizeImage(objImg){
var img = new Image();
img.src = objImg.src;

var w = img.width;
var h = img.height;

var Ratio= w/h;

if (Ratio>1){

objImg.width = 150;  //如果图片宽度大于高度,控制宽度,高度自适应缩放

}else{

objImg.height = 150; //如果图片高度大于宽度,控制高度,宽度自适应缩放

}

}

然后图片引用位置写上<img src='地址' onload='AutoResizeImage(this)' />即可。展示效果如下图:

 

标签:js控制图片缩放等比例图片大小
分类:技术文档| 发布:ying| 查看: | 发表时间:2012-1-12
原创文章如转载,请注明:转载自英'Blog http://blog.21863.cn/
本文链接:http://blog.21863.cn/article/217.html
后来者:« 万恶的百度快照!想说爱你不容易
前 辈:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

Design By | Login | Power By Z-Blog 1.8 Walle Build 100427.