关闭

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

标签: iefunctionclassdivborderfloat
1322人阅读 评论(0) 收藏 举报

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>

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:3266次
    • 积分:74
    • 等级:
    • 排名:千里之外
    • 原创:3篇
    • 转载:0篇
    • 译文:0篇
    • 评论:0条
    文章分类
    文章存档