css - 在下拉菜单中保持顶部菜单项突出显示

Question

只需将此站点放在一起，并希望当您将鼠标悬停在下拉菜单项上时，带有下拉菜单项的菜单项仍以白色突出显示。 http://dl.dropbox.com/u/7086475/Paul%20Day/index.html

Answer 1

而不是使用#nav a:hover选择器，您可以使用它#nav li:hover。

与锚不同，当您在子菜单中时，li 将保持悬停状态。

它在 IE6 中不起作用，因为悬停伪类仅适用于锚点。

#nav li:hover{
 color: #fff;
}

Answer 2

您可以css class使用 为父 li 的悬停状态设置jquery or javascript。

编辑

你可以像这样设置一个css类......

$(document).ready(function() {
    $("#nav li li").mouseenter(function() {
      $(this).parent().parent().addClass("test");
    });

    $("#nav li li").mouseleave(function() {
      $(this).parent().parent().removeClass("test");
    });
});

和 CSS 样式...

.test { font-weight:bold; color:#fff; }

Answer 3

使用这个jquery，它将解决你的问题

$(function() {
        $('#nav li ul').hover(function() {
           $(this).prev('#nav li a').css('color', '#FF6600');
        }, function() {
            $(this).prev('#nav li a').css('color', '#fff');
        });
    });