这是一段网上搜得的自动调整图像大小的简易代码,它可以将超过大小的图像按比例缩放至设定范围内,IE下的工作非常好。例中,如果高大于300则把高调为300,宽按比例缩,反之一样。
但是在Firefox中却纹丝不动,尝试了一些小改变也未成功,请各位JS达人帮忙。<script language="JavaScript"> 
function SetImgSize(img) {
    var maxWidth = 300;
var maxHeight = 300;
var imgWidth = img.width;
var imgHeight = img.height;

if(imgWidth <= maxWidth && imgHeight <= maxHeight) {
    }
    else {
    if((maxWidth / maxHeight) > (imgWidth / imgHeight)) {
    img.style.height = maxHeight;
img.style.width = imgWidth * (maxHeight / imgHeight);
}
        else {
    img.style.width = maxWidth;
img.style.height = imgHeight * (maxWidth / imgWidth);
}
}
}
</script>
只需在img中加入属性onload="SetImgSize(this);"即可。先行谢过

解决方案 »

  1.   

            if((maxWidth / maxHeight) > (imgWidth / imgHeight)) {
                img.style.height = maxHeight+"px";
                img.style.width = imgWidth * (maxHeight / imgHeight)+"px";
            }
            else {
                img.style.width = maxWidth+"px";
                img.style.height = imgHeight * (maxWidth / imgWidth)+"px";
            }
    未测试  但是这些地方是绝对要+上的 
      

  2.   

    img.style.height带了style就是行内CSS样式了,注意CSS样式在非IE浏览器宽度是要加单位的px加上FF就OK了二楼代码正确。。或者直接img.height
    IE及火狐也OK。
      

  3.   

    是需要加上"px"建议楼主先alert出来看看再匹配
      

  4.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title><script language="JavaScript"> 
    function SetImgSize(img) {
        var maxWidth = 300;
        var maxHeight = 300;
        var imgWidth = img.width;
        var imgHeight = img.height;
        
        if(imgWidth <= maxWidth && imgHeight <= maxHeight) {
        }
        else {
            if((maxWidth / maxHeight) > (imgWidth / imgHeight)) {
                img.style.height = maxHeight + "px";
                img.style.width = imgWidth * (maxHeight / imgHeight) +  "px";
            }
            else {
                img.style.width = maxWidth +"px";
                img.style.height = imgHeight * (maxWidth / imgWidth) +"px";
            }
        }
    }
    </script></head> 
    <body> 
    <img src="2.jpg" onmouseover="SetImgSize(this)" /> 
    </body> 
    </html>
    在ff下没有问题
      

  5.   

    啊,谢谢各位。
    我明白原因是什么了,因为我的图片宽 > 300,高 > 300,所以在FF下缩放出问题。现在我只要把条件改一下就OK了。