jquery显示隐藏层ie6和ie7的问题,鼠标经过<li>白富美</li>显示隐藏层,但显示的层不能盖住后面的li
<head><scriptsrc="../scripts/jQueryv1.10.1.js"type="text/jscript"></script><scripttyp...
<head>
<script src="../scripts/jQuery v1.10.1.js" type="text/jscript"></script>
<script type="text/javascript">
$(function(){
var $li_1 = $("div.tag-bg ul li:has(dl)")
$li_1.mouseover(function() {
$(this).children("dl").show()
}).mouseout(function() {
$(this).children("dl").hide()
});
})
</script>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
text-decoration: none;
}
.tag-bg {
width: 800px;
height: 40px;
}
.tag-bg ul li {
line-height: 34px;
float: left;
margin: 0px 15px;
white-space: nowrap;
position: relative;
}
.tag-bg ul li dl {
border: 1px solid #BBB;
background-color: #fff;
position: absolute;
z-index: 5;
display: none;
left: -3px;
top: -1px;
}
</style>
</head>
<body >
<div class="tag-bg">
<ul>
<li><a href="#">白富美</a>
<dl>
<dd><a class="red" href="#">白富美</a></dd>
<dd><a class="gray6" href="#">白会员</a></dd>
<dd><a class="gray6" href="#">富会员</a></dd>
</dl>
</li>
<li><a href="#">高帅富</a> </li>
</ul>
</div>
<div class="tag-bg" >
<ul>
<li><a href="#">购买过1次的会员</a> </li>
<li><a href="#">购买过2次的会员</a></li>
</ul>
</div>
</body> 展开
<script src="../scripts/jQuery v1.10.1.js" type="text/jscript"></script>
<script type="text/javascript">
$(function(){
var $li_1 = $("div.tag-bg ul li:has(dl)")
$li_1.mouseover(function() {
$(this).children("dl").show()
}).mouseout(function() {
$(this).children("dl").hide()
});
})
</script>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
text-decoration: none;
}
.tag-bg {
width: 800px;
height: 40px;
}
.tag-bg ul li {
line-height: 34px;
float: left;
margin: 0px 15px;
white-space: nowrap;
position: relative;
}
.tag-bg ul li dl {
border: 1px solid #BBB;
background-color: #fff;
position: absolute;
z-index: 5;
display: none;
left: -3px;
top: -1px;
}
</style>
</head>
<body >
<div class="tag-bg">
<ul>
<li><a href="#">白富美</a>
<dl>
<dd><a class="red" href="#">白富美</a></dd>
<dd><a class="gray6" href="#">白会员</a></dd>
<dd><a class="gray6" href="#">富会员</a></dd>
</dl>
</li>
<li><a href="#">高帅富</a> </li>
</ul>
</div>
<div class="tag-bg" >
<ul>
<li><a href="#">购买过1次的会员</a> </li>
<li><a href="#">购买过2次的会员</a></li>
</ul>
</div>
</body> 展开
1个回答
展开全部
<!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">
<head>
把头部替换成这个就可以了。我尝试过了,如果当当用<html> <head> 就会出现你那种问题。
更多追问追答
追问
我头部本来是加那坨东西的,我是没复制....要不字数不够。 ie6和7不行,不知道是CSS问题还是JS问题
追答
白富美 样式问题,你在li的样式里加 z-index属性就可以了。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询