ie6下面li标签无法被撑开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style type="text/css">
*{
padding:0px;
margin:0px;
}
ul{
list-style:none;
}
#nav{
width:100%;
height:50px;
}
#nav_box{
width:1200px;
height:50px;
margin:0 auto;
/*background:red;*/
position:relative;
}
#nav_box .big{
width:260px;
height:50px;
display:block;
position: absolute;
left:0px;
top:0px;
line-height:50px;
text-align:center;
background:#b81c22;
color:#fff;
font-family: 'microsoft yahei';
font-size:17px;
font-weight: 400;
cursor: pointer;
}
#nav_box #little{
width:940px;
height:50px;
position: absolute;
top:0px;
left:260px;
}
#little li{
width:117.5px;
float:left;
line-height:50px;
zoom:1;
/*border:1px solid red;*/
}
#little li a{
width:100%;
height:50px;
display:block;
color:#727171;
font-size:16px;
text-align:center;
background:#efefef;
font-family: 'microsoft yahei';
}
#little li #two_ul{
width:938px;
height:170px;
border:1px solid #ccc;
position:absolute;
top:50px;
left:0px;
display:none;
z-index:1000;
display:none;
}
#two_ul #hide_box{
width:938px;
height:170px;
}
#hide_box li{
width:460px;
height:150px;
margin-top:10px;
padding:0px;
/*float:left;*/
display:inline;
position:relative;
}
#hide_box li.show_left{
width:460px;
border-right:1px solid #ccc;
}
#hide_box li.show_right{
width:477px;
}
.show_left #icon,.show_right #icon{
width:140px;
height:140px;
position: absolute;
left:50px;
top:5px;
}
#icon img{
border:none;
width:140px;
height:140px;
}
.show_left #title,.show_right #title{
width:200px;
position:absolute;
left:200px;
top:5px;
font-size:17px;
color:#727171;
font-weight: 700;
line-height:30px;
background:white;
text-align:left;
}
.show_left #price,.show_right #price{
width:80px;
text-align:left;
position:absolute;
left:200px;
top:70px;
color:#b81c22;
font-family: '宋体';
font-size:16px;
line-height:30px;
background:white;
}
.show_left #intro,.show_right #intro{
width:150px;
position:absolute;
top:40px;
left:200px;
font-size:12px;
color:#ccc;
line-height:15px;
}
</style>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title></title>
<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$("#little>li").mouseover(function(){
$(this).children("a").css('color',"#c81623");
$(this).children("div#two_ul").show();
});
$("#little>li").mouseout(function(){
$(this).children("a").css('color',"#727171");
$(this).children("div#two_ul").hide();
});
})
</script>
</head>
<body>
<div id="nax">
<div id="nav_box">
<ul id="little">
<li>
<a href="">T恤</a>
<div id="two_ul">
<ul id="hide_box">
<li class="show_left">
<a href="" id="icon">
<img src="./images/nan.jpg" alt="" />
</a>
<a href="" id="title">凡客T恤 男款</a>
<span id="intro"></span>
<span id="price">￥59</span>
</li>
<li class="show_right">
<a href="" id="icon">
<img src="./images/nv.jpg" alt="" />
</a>
<a href="" id="title">凡客T恤 女款</a>
<span id="price">￥59</span>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
</body>
</html>
当鼠标移动到 li标签上时显示隐藏的div层 two_ul 要求鼠标是能移入到two_ul层的 上面的代码在ie8以上的可以实现 但是在ie6下无法实现！在ie6下 鼠标离开了li标签 two_ul层就会隐藏。麻烦知道的告知下ie6下如何实现！谢谢了！
八意Yo琳
9 years, 5 months ago
