`
liboxlu
  • 浏览: 65081 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

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

    博客分类:
  • css
阅读更多
由于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.
0
0
分享到:
评论

相关推荐

    详解在table设置max-width以及min-width兼容问题和解决方案

    在table中设置min-width和max-width属性 ...解决方案:在table外层包一个div,在div上设置min-width和max-width &lt;div class=table-wrap&gt; &lt;tr&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;/tr&gt; .table-wrap{width:5

    IE6支持max-width/height与min-width/height(完美解决方案)

    IE6本身并不支持max-width属性,但我们可以通过一个JavaScript表达式来模拟这一行为。当元素的宽度大于设定值时,元素的宽度会被设置为该值,否则保持不变。这一方法通过CSS的_width属性实现,_width是IE浏览器的...

    让IE6支持兼容min-width、max-width CSS样式属性的方法

    IE6 不支持标准的 `max-width` 属性,但可以通过使用特定的IE私有属性 `_width` 和 JavaScript 表达式来模拟这一功能。以下是实现方式: ```css .yangshi { max-width: 1000px; _width: expression((document....

    IE 6不支持min-height或max-width等属性的完美解决方案

    请看geniusalien提供的完美解决方案: (geniusalien温馨提示:本文的min-height操作方式试用于min-width、max-width、max-height。一样按下面的解决方案进行!) 第一种方法:我们可以利用IE6不识别!important来...

    让IE6支持min-width和max-width的方法

    由于IE6不支持这些属性,我们可以利用JavaScript和CSS表达式来模拟这些功能。以下是一种常见的解决方案: 1. 首先,我们需要创建一个JavaScript函数`minmax_bind(el)`,该函数会在每个新元素加载时被调用。这个函数...

    jquery实现图片等比例缩放以及max-width在ie中不兼容解决

    这种方法不仅适用于IE6,也可以作为跨浏览器的图片缩放解决方案,特别是对于那些不完全支持`max-width`的旧版浏览器。通过结合jQuery的事件监听和DOM操作,我们可以更好地控制和优化页面元素在不同环境下的表现。

    解决IE6兼容问题的十一大技巧

    6. **最小高度(min-height)**:IE6不支持`min-height`属性,但可以通过CSS hack来解决,如: ```css #container { min-height: 200px; height: auto !important; /* 对其他浏览器生效 */ height: 200px; /* 对...

    IE6-IE11兼容性问题列表及解决办法

    IE6对于CSS的支持非常有限,例如不支持浮动元素的`clear:both`属性,不理解`min-height`和`max-height`,且对盒模型的理解与W3C标准不符,导致布局混乱。解决这些问题通常需要使用特定的hack技巧,如使用`_width`...

    css.rar_csspicture

    对于IE6、IE7,它们不完全支持CSS2中的`max-width`属性。为了解决这个问题,我们可以使用CSS hack。例如,我们可以使用条件注释或特定的CSS前缀来专门针对这些老版本的IE浏览器编写规则。例如: ```css /* 针对IE6...

    div+css布局限制图片最大宽度图片水平垂直居中兼容IE6

    在现代浏览器中,我们可以使用Flexbox或Grid布局轻松实现,但IE6并不支持这些特性。所以,我们需要使用更兼容的CSS技巧。对于水平居中,可以设置父元素的`text-align`属性为`center`: ```css .container { text-...

    7个步骤让PC网站自动适配手机网页.pdf

    老版本的IE 不支持max-width,可以使用img{width:100%;}来实现图片的自动缩放。 通过这7个步骤,可以让PC网站自动适配手机网页,实现移动适配技术。切图网是国内首家基于web技术服务的公司,提供移动适配技术的解决...

    IE6_IE7_IE8 CSS 兼容速查表

    8. `min-width`和`max-width`:IE6不支持这两个属性,可以使用`_width`(仅IE6识别)和条件性注释来模拟效果。 9. `text-shadow`和`box-shadow`:IE6-8不支持阴影效果,可以使用JavaScript库或者图片替换方法来实现...

    Web-前端html+css从入门到精通 168. IE低版本常见BUG.zip

    布局方面,IE6不支持`min-width`和`max-width`,可以使用`_width`和`expression`来实现类似效果。另外,IE6/7对浮动元素和绝对定位的处理有误,导致“双倍边距”问题和“hasLayout”机制,需要特别处理。 最后,...

    CSS expression控制图片自动缩放效果代码[兼容 IE,Firefox]

    如本问题中提到的,IE6不支持max-width属性,这使得使用纯CSS实现图片自动缩放变得复杂。 3. max-width属性:max-width是一个CSS属性,用于设置元素的最大宽度。当元素的宽度超过max-width指定的值时,元素的宽度将...

    div css布局制作数据统计走势图表代码IE6不兼容

    此外,它也不支持`CSS2.1`及之后版本的一些布局属性,如`position: fixed`、`min-width`、`max-width`,这对制作响应式图表或固定头部等布局来说是个挑战。 为了解决`IE6`的兼容性问题,开发者通常需要采用一些特定...

    ie兼容问题

    由于IE6不支持CSS3的选择器,我们可以使用以下方式来专用于IE6: ```css /* IE6专用 */ .content { color: red; } /* 非IE6专用 */ div &gt; p.content { color: blue; } ``` 这样设置后,IE6将仅应用`.content`类的...

    [网页重构xhtml.css].css.hack.pdf

    `min-width`属性允许设定元素的最小宽度,但IE6不支持。可以使用JavaScript或CSS表达式来模拟此功能: ```css min-width: 300px; /* 或针对IE6 */ *html .element { width: expression(this.offsetWidth ); } ```...

    CSS HACK收集:关于IE6/FF/google等浏览器hack的方法详细

    类似于max-width和min-height,IE6不支持min-width。可以使用JavaScript检查元素的clientWidth,并根据需要动态设置宽度。 CSS Hack是前端开发者应对浏览器兼容性问题的重要工具,理解并正确使用这些技巧可以确保...

Global site tag (gtag.js) - Google Analytics