用js/jquery让图片等比缩放

今天做了一个很简单的功能,用js/jquery让图片等比缩放;

网站内容页的图片有时候很大。会超出内容页的宽。然后呢在添加图片的时候,会写入宽和高的值。

我就用css限制了图片的最大宽度。

[code lang=”css”]

.post .entry-content img {
max-width: 543px;
}
[/code]

这对于主流浏览器来说已经解决了问题。可是ie下不行,因为图片这样的:

《img src=”” width=”1200″ height=”700″>

这里已经写了绝对宽和高。所以ie下变形了。宽度是css强制变为 543px 可高没变

于是就拉长了!

好吧,现在看js解决方案:

[code lang=”js”]
jQuery(".post .entry-content img").each(function(){
var imgw = jQuery(this).attr("width");
var imgh = jQuery(this).attr("height");
var autoh = (imgh*543)/imgw;//计算出等比例的高度
if(imgw>543){
jQuery(this).attr({"width":"543",height:autoh});//写入图片中。
}
});
[/code]

这样就搞定了!