IE6下Z-index无效/不兼容/失效的解决办法【绝对原创】

原创 2011年01月15日 11:44:00

css

 

@charset "gb2312";
*{ margin:0; padding:0}
.clear{ clear:both;}
li{ list-style-type:none;}
.box {
 height: 300px;
 width: 300px;
 margin: 0 auto;
}
.box .test {
 display: none;
 background-color: #FFE8E8;
 border: 1px solid #FF0000;
 position: absolute;
 width: 100px;
 height: 50px;
 z-index: 999;
 left: 0px;
}
.box li {
 float: left;
 width: 100px;
 text-align: center;
}
.box a {
 color: #333333;
 text-decoration: none;
 font-weight: bold;
 display: block;
 line-height: 30px;
 background-color: #CCCCCC;
 z-index: 0;
}
.box a:hover {
 color: #FFFFFF;
 background-color: #006699;
}

 

 

 

 

 

 

html代码

 

<div class="box">
<ul>
<li><a href="#">链接一</a><div class="test">拉的积分垃圾速度快浪费</div></li>
<li><a href="#">链接一</a><div class="test">拉的积分垃圾速度快浪费</div>
</li>
<li><a href="#">链接一</a><div class="test">拉的积分垃圾速度快浪费</div>
</li>
<li><a href="#">链接一</a><div class="test">拉的积分垃圾速度快浪费</div>
</li>
<li><a href="#">链接一</a><div class="test">拉的积分垃圾速度快浪费</div>
</li>
<li><a href="#">链接一</a><div class="test">拉的积分垃圾速度快浪费</div>
</li>
</ul>
</div>
</body>
</html>
<script>
$('.box a').hover(function(){$(this).next('div').show();},function(){$(this).next('div').hide();});
$('.box a').next('div').hover(function(){$(this).show();$(this).prev('a').addClass('cur');},function(){$(this).hide();$(this).prev('a').removeClass('cur');});
$('.box li').hover(function(){$(this).css('position','relative');},function(){$('li').css('position','');});
</script>

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

ie7下子元素设置z-index无效的解决办法

html部分 首页 品牌 女装 女装: 耐克 阿...

CSS在IE6下的一些BUG和兼容性问题及解决办法

兼容性一直是前端的一大问题,也是让前端工程师很头痛的事情,在浏览器中,各厂商都有一套属于自己的标准和方法,从某种程度上看,是否能很好的处理兼容性问题,体现着一个前端工程师的水平,下面看一下CSS在IE...

z-index ie6下的解决方案

文章源链接:http://www.jb51.net/css/29329.html        点评:非同辈元素,任意一者或其祖元素拥有动态定位时,同时各自向上寻找动态定位的祖元素至共...

解决IE6 select z-index无效,遮挡div的bug

在最近的一个项目中,遇到了IE6 select遮挡div的bug,为了解决这个bug我查了很多资料,试图找到一个最最有效的方法,很多人是通过iframe的方法来解决,其实我查了国外的很多资料也是通过i...

ie7下z-index失效问题解决方法(详细分析)

绝对定位元素的“有定位属性(relative或absolute)的父元素”在渲染层次时起到了主要作用,前面的被后面的覆盖了。解决办法就是给有定位属性的父元素设置z-index 解决办法: 父级元素加上...

IE下 z-index 的各种坑(非原创,不过觉得不错转载过来)

IE下 z-index 的各种坑 2012-03-05 21:40 by 聂微东, 18432 阅读, 40 评论, 收藏, 编辑   到新地方有些日子了,差不多适应了这边的工作节奏与流程。接到...

IE6下的多余字符bug的2种情况和解决办法

情况一: #content {width:774px;} .title { display:block; float:left; width:50%; m...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)