ie6不支持max-width的解决方案

IE6下图片尺寸控制

最新推荐文章于 2021-10-04 14:04:59 发布

最新推荐文章于 2021-10-04 14:04:59 发布 · 171 阅读

文章标签：

#IE #CSS #浏览器

css 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了两种在IE6浏览器中实现图片最大宽度限制的方法。一种是使用CSS表达式，但可能引起浏览器崩溃；另一种是通过JavaScript动态调整图片宽度。

由于ie6不支持max-width属性，所以只有通过js来实现
第一种是利用css中的expression来实现例如
_width: expression(this.offsetWidth > 500 ? "500px" : this.offsetWidth + "px");
可是这种方法很有可能造成浏览器的崩溃，很耗资源，而且会出现不可预料的错误
第二种就是在js函数中调用：
比如如果我们要动态显示某张图片，并给图片设定最大宽度，当图像加载完后我们可以对图像的宽度进行动态判断，如果大于最大宽度则设置最大值，否则取原有值


function resizeImg(img){
        var image=new Image();
        image.src = img.src;
        if(image.width > 500 || image.width <= 0)
            img.style.width = 500 + "px";
        else
             img.style.width = image.width + "px";
}

貌似ie对img.width支持不是很好，返回值一直为0.而借助中间对象，可以解决该问题,而firFox绝对没有这个问题。另外为以防万一，我们设定如果图片width真返回为0时，图片宽也为500.