0

我有一个 ul 列表，下面我使用 jquery 来确定用户是否悬停在 about us 下的子菜单，如果是，则在悬停时设置一些 css。这确实将背景颜色更改为绿色，但是当我将鼠标悬停在绿色上时不会消失？

查询

$('ul > li > ul > li a').hover(
    function(){
        var whatami = $(this).parents('li').eq(1).find('a[title]:first').attr('title');
        console.log(whatami);
        if (whatami == 'About Us') {
            //alert(whatami);
            $('.white ul.mega-menu li .sub-container.non-mega li a:hover').css({"background-color":"green"});

        }
    },
    function(){
    });
4

3 回答 3

3

hover 的工作方式是第一个函数在鼠标进入时执行，第二个函数在鼠标离开时执行。您在第二个函数中没有任何内容，因此这意味着鼠标离开时不会发生任何事情。你需要在第二个函数中做任何你想做的事情：

$('ul > li > ul > li a').hover(
function(){
    // make it green
},
function(){
    // CHANGE IT BACK HERE
});
于 2012-09-07T18:52:50.933 回答
2

在 jQuery 中 :hover 只是一个元素选择器，它与 CSS a:hover 不同。尝试类似：

$('.white ul.mega-menu li .sub-container.non-mega li a').hover(
    function () {
        $(this).css({"background-color":"green"});
    },
    function () {
        $(this).css({"background-color":"none"});
    }
); ​
于 2012-09-07T18:54:48.747 回答
0

.white ul.mega-menu li .sub-container.non-mega li a是您应该用作选择器的内容，您当前的选择器ul > li > ul > li a更加通用。

尝试使用任$(this)一设置绿色

于 2012-09-07T18:53:54.243 回答