HTML5网页设计

html_css

jQuery解决IE6不支持max-height

时间:2012-05-25 11:46来自:未知作者:admin点击:
众所周知蛋疼的IE6不支持max-height,但是此样式很实用,因此只能通过其他办法实现。 1、使用jQuery,需要先链接jquery库。

众所周知蛋疼的IE6不支持max-height,但是此样式很实用,因此只能通过其他办法实现。

1、使用jQuery,需要先链接jquery库。

  1. $(".entry").each(function(){ 
  2. if($(this)[0].scrollHeight>500) 
  3. $(this).css({"height":"500px"}); 
  4. }); 

原理: 在IE6中可以通过设定height来达到max-height的效果. 循环所有要加max-height属性的DOM元素,判断他的scrollHeight大于你要设置的最大高度 如果超过了就通过设置height为最大高度

上面的代码还没有加入IE6的判断,完整代码如下:

  1. if($.browser.msie&&($.browser.version == "6.0")&&!$.support.style){ 
  2. $(".entry").each(function(){ 
  3. if($(this)[0].scrollHeight>500) 
  4. $(this).css({"height":"500px","overflow":"hidden"}); 
  5. });} 

2、通过使用css表达式expression(不推荐)来实现IE6支持max-height属性

  1. .entry{ 
  2. height: expression( this.scrollHeight > 500 ? "500px" : "auto" ); /* sets max-height for IE */ 

当前文章地址:http://www.shejicool.com/web/html_css/337.html

阅完本篇文章?您还可以: 收藏本文 文章挑错 朋友推荐