下拉菜单在悬停时消失（博客）

I'll be honest right off the bat, I am not a coder. I got the original code for this from a tutorial and just tweaked the colors and fonts, but when I hover on the main menu item and try to click the sub-menu, it vanishes. I see from other threads this is a common problem, but I can't seem to find a previously asked question with code like mine.

我会说实话,我不是编码员。我从教程中获得了原始代码,只是调整了颜色和字体,但是当我将鼠标悬停在主菜单项上并尝试单击子菜单时,它就会消失。我从其他线程看到这是一个常见的问题,但我似乎无法找到像我一样的代码。

/**MBW mybloggersworld.com Navgation bar **/
#mbwnavbar {
background: #ffffff;
width: 960px;
color: #FFF;
margin: 0px;
padding: 0;
position: relative;
border-top:0px solid #ffffff;
height:35px;
}
#mbwnav {
margin: 0;
padding: 0;
}
#mbwnav ul {
float: left;
list-style: none;
margin: 0;
padding: 0;
}
#mbwnav li {
list-style: none;
margin: 0;
padding: 0;
border-left:1px solid #ffffff;
border-right:1px solid #ffffff;
height:35px;
}
#mbwnav li a, #mbwnav li a:link, #mbwnav li a:visited {
color: #000000;
display: block;
font:bold 16px Coming Soon;    margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;

}
#mbwnav li a:hover, #mbwnav li a:active {
background: #ffffff;
color: #000000;
display: block;
text-decoration: none;
margin: 0;
padding: 9px 12px 10px 12px;

}
#mbwnav li {
float: left;
padding: 0;
}
#mbwnav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 160px;
margin: 0;
padding: 0;
}
#mbwnav li ul a {
width: 140px;
}
#mbwnav li ul ul {
margin: -25px 0 0 161px;
}
#mbwnav li:hover ul ul, #mbwnav li:hover ul ul ul, #mbwnav li.sfhover ul ul, #mbwnav
li.sfhover ul ul ul {
left: -999em;
}
#mbwnav li:hover ul, #mbwnav li li:hover ul, #mbwnav li li li:hover ul, #mbwnav 
li.sfhover ul, #mbwnav li li.sfhover ul, #mbwnav li li li.sfhover ul {
left: auto;
}
#mbwnav li:hover, #mbwnav li.sfhover {
position: static;
}
#mbwnav li li a, #mbwnav li li a:link, #mbwnav li li a:visited 
{
background: #ffffff;
width: 120px;
color: #000000;
display: block;
font:normal 12px Coming Soon;
margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
z-index:1010;
border-bottom:0px dotted #ffffff;

}
#mbwnav li li a:hover, #mbwnavli li a:active {
background: #ffffff;
color: #000000;
display: block;     margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}

Any idea how to make the submenu stay long enough for someone without super human speed to click a submenu?

任何想法如何使子菜单保持足够长的时间,没有超人力的人点击子菜单?

Please and thank you :)

谢谢,麻烦您了 :)

1 个解决方案

#1

without seeing your html to test, it's very difficult to guess, but try changing:

没有看到你的HTML测试,很难猜测,但尝试改变:

#mbwnav li:hover ul, #mbwnav li li:hover ul, #mbwnav li li li:hover ul, #mbwnav 
li.sfhover ul, #mbwnav li li.sfhover ul, #mbwnav li li li.sfhover ul {
left: auto;
}

#mbwnav li:hover ul, #mbwnav li li:hover ul, #mbwnav li li li:hover ul, #mbwnav 
li.sfhover ul, #mbwnav li li.sfhover ul, #mbwnav li li li.sfhover ul {
left: auto; display:block; position:relative;
}

you may also need some negative top margin (like margin-top:-5px) but see if this code is of help. If not, please post the html so we can test

你可能还需要一些负的上边距(如margin-top:-5px),但看看这段代码是否有帮助。如果没有,请发布html,以便我们测试

#1