我对这个下拉菜单有问题,当您单击表单(链接)打开一个菜单时,如果您将其移出表单(链接),颜色会变为蓝色并且很难看到
任何解决办法
HTML:
<nav id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#" id="showHide" class="act">Forms</a>
<ul id="smenu">
<li><a href="#" >Car Form</a></li>
<li><a href="#">Job Fomr </a></li>
<li><a href="#" target="_blank">Test Form </a></li>
<li><a href="#">Forms </a></li>
</ul>
</li>
<li><a href="#">Contact Us</a></li>
</ul>
</nav>
CSS:
nav#menu
{
width:192px;
background:#FFF;
padding:0px;
margin:-7px 0px 0px 0px;
}
nav#menu a
{
color:#18819c;
text-decoration:none;
display:block;
height:100%;
margin: -10px 0px 0px -10px;
padding: 10px 0px 10px 10px;
}
nav#menu ul li
{
width: 192px;
margin: 5px 0px -8px -10px;
padding: 10px 0px 0px 10px;
border-bottom:2px solid #c9dce1;
}
nav#menu ul li:hover
{
background:#0f7691;
color:#FFF !important;
}
nav#menu ul li a:hover
{
color:#FFF;
}
#smenu {
display:none;
background:#FFF;
margin: 0px 0px 0px -10px;
padding: 0px 0px 0px 30px;
}
#smenu ul
{
margin:0;
}
#smenu ul li a:hover
{
background:#FFF;
}
JS:
$(document).ready(function(){
$('#showHide').click(function(){
$('#smenu').slideToggle('slow');
});
});
最佳答案
将其添加到您的 CSS
nav#menu ul li:hover>a
{
color:#FFF;
}
关于javascript - 悬停在下拉菜单上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23397620/