2009年10月24日星期六

IE 6&7 z-index bug

很老的 bug了,详细描述看下面几篇文章吧:

  1. position:relative/absolute无法冲破的等级
  2. 对《无法冲破的等级》一文的补充
  3. 补遗《无法冲破的等级》

文中给出的方法简单明了,不过有时页面比较复杂,只有通过用JS遍历 position:relative 元素并改变其 z-index 值来解决了。有了 JS 框架则更加简单。《Fixing IE z-index》分别给出了 jQuery 和 MooTools 版本,下面是 jQuery 版本的代码:

$(function() {
       var zIndexNumber = 1000;
       // Put your target element(s) in the selector below!
       $("div").each(function() {
               $(this).css('zIndex', zIndexNumber);
               zIndexNumber -= 10;
       });
});

DEMO 在此

没有评论: