下面是我自己所写的代码，只有“首页”这个菜单的子菜单设置了延时消失。
但是有bug啊啊啊啊啊。当鼠标移到第一个主菜单时，该菜单的子菜单出现了，然后再把鼠标移到第二个子菜单，然后该菜单的子菜单也出现了。
但是问题是第一个主菜单的子菜单设置了延迟消失，然后就出现问题了。 具体如何解决呢？
ul{
list-style: none;//取消样式
margin: 0px;
padding: 0px;
}
li{
float: left;
}
a{
text-decoration: none;
}
#nav-div{
width: 500px;
height: 40px;
background: lavender;
margin: auto;
border-bottom: solid 3px paleturquoise;
}
#nav-div ul li{
margin-left: 2px;
width: 78px;
height: 40px;
}
#nav-div ul li a{
display: block;
width: 78px;
height: 40px;
line-height: 40px;
text-align: center;
}
#nav-div ul li ul{
border:1px solid #ccc;
position: absolute;
display: none;
}
#nav-div ul li ul li{
display: block;
float: left;
}
#nav-div ul li:hover ul{
display: block;
}
//出现底部的指示线
#nav-div ul li:hover{
border-bottom: solid 3px palevioletred;
}
var shouye = document.getElementById("shouye");
shouye.onmouseout = function(){
setTimeout(function(){
document.getElementById("shouye_sub").style.display = "none";
},1000);
}
shouye.onmouseover = function(){
document.getElementById("shouye_sub").style.display = "block";
}
230
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
