用jQuery在IE6下实现css的max-width属性

样例目标:要对一个class为blockimage的div下所有图片应用css文件所设置的max-width值。由于IE6不支持这个属性,所以需要用JavaScript来进行模拟实现。

XHTML:

<div class="blockimage">
<image src="1.jpg" />
<image src="2.jpg" />
<image src="3.jpg" />
</div>

CSS:

.blockimage img{
max-width: 400px;
}

JavaScript with jQuery:

/*=================================
to simulate the max-width of the
images in the ".blockimage" div with
ie 6, author: Jimbor Chu ***/
  if($.browser.msie && $.browser.version == 6.0)
  {
    var maxWidth = parseInt($('.blockimage img').css('max-width'));
    $('.blockimage img').each(function(){
      if ($(this).width() > maxWidth)
        $(this).width(maxWidth);
    });
  }

类似的,max-height, min-width, min-height也可以用这种方法来实现。

上一篇: jquery插件简明制作教程   下一篇: div滚动条美化

提交疑问

回顶部