作者热门文章
- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont?
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
我有一个菜单,其中一些菜单项可能有子项。其实很简单。我想实现的是,一旦将鼠标悬停在子菜单上,相应的(父)菜单项也会突出显示。这永远不会发生,因为似乎只要鼠标离开菜单项并越过子菜单,浏览器就会将其设置为默认样式。任何帮助表示赞赏!非常感谢!
菜单 html:
<div id="top_navigation">
<ul>
<li><a href="#">item1</a></li>
<li><a href="#">item2</a>
<ul class="submenu">
<li><a href="#">sub1</a></li>
<li><a href="#">sub2</a></li>
<li class="selected_menu_item"><a href="#">sub3</a></li>
</ul>
</li>
<li><a href="#">item3</a></li>
<li><a href="#">item4</a></li>
</ul>
</div>
CSS:
#top_navigation {
width: 1248px;
margin: 0 auto;
position: relative;
text-transform: uppercase;
font-family: "Rounded Font", sans-serif;
font-size: 23px;
}
#top_navigation ul ul {
display: none;
}
#top_navigation ul {
padding-left: 0;
}
#top_navigation ul li {
margin: 0;
padding: 0;
float: left;
width: 312px;
height: 64px;
line-height: 64px;
font-size: 20px;
list-style: none;
}
#top_navigation ul li a {
display: block;
text-align: center;
text-decoration: none;
color: #eb1f10;
background-color: #FFF;
}
#top_navigation ul li.selected_menu_item a {
background-color: #eb1f10;
color: #FFF;
}
#top_navigation ul li a:hover {
background-color: #eb1f10;
color: #FFF;
}
#top_navigation li li {
height: 42px;
line-height: 42px;
border-top: #eb1f10 1px solid;
}
JS/Jquery:
$(document).ready(function () {
var $nav = $('#top_navigation > ul > li');
$nav.hover(
function() {
$('ul', this).stop(true, true).slideDown('fast');
},
function() {
$('ul', this).slideUp('fast');
}
);
});
例子可以在这里找到:http://jsfiddle.net/qguTz/
最佳答案
哦,现在我不知道我以前怎么没有想到......我会回答:
交换这个就够了:
#top_navigation ul li a:hover {
background-color: #eb1f10;
color: #FFF;
}
为此:
#top_navigation ul li:hover > a {
background-color: #eb1f10;
color: #FFF;
}
关于jquery - 将鼠标悬停在子菜单上后保持父菜单项突出显示(HTML/CSS/Jquery),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16802823/
有没有一种方法可以“标记”对象的属性,使它们在反射中“突出”? 例如: class A { int aa, b; string s1, s2; public int AA
我是一名优秀的程序员,十分优秀!