jQuery:在脱离元素时保持悬停状态？

Question

1.我有两个菜单，" main“和" sub”--当您在主菜单中的特定链接上悬停时，它通过向it...great添加一个类来突出显示子菜单.问题是，当我滚下“主力链接”时，子导航的颜色会恢复正常.-但是我需要把这个保存下来如果我滚到潜艇导航上.他们都强调..。

1. ...then..。一旦我实际悬停在子nav....then上，高亮显示将只cease...and我滚动到的子菜单链接到突出显示的颜色(这可以是正常的“a:悬停”状态。

。

所以我想简单来说..。

悬停在主菜单上的item...the子菜单项目被突出显示.离开主nav...the子菜单仍然高亮显示.(虽然只有当从主菜单突出显示到子菜单时才会高亮显示)--无论如何，它会松开高亮显示) ...then在menu...remove子菜单上高亮显示一次(因此标准a:鼠标悬停以使子菜单get被使用.

到目前为止，这是我的代码，它激活了全局突出显示：

<ul id="primarynav">
    <li><a href="">home</a></li>
    <li class="portfolio"><a href="">protfolio</a></li>
    <li><a href="">contact</a></li>
</ul>

<!-- Secondary nav -->

<ul id="secondarynav">
    <li><a href="">Websites</a></li>
    <li><a href="">Graphics</a></li>
    <li><a href="">Drawing</a></li>
</ul>


$(document).ready(function(){
    var $primarynav = $('#primarynav .portfolio'),
        $secondarynav = $('#secondarynav');

    $primarynav.hover(function(){
        $secondarynav.addClass('highlight');
    }, function(){
        $secondarynav.removeClass('highlight');
    });
});

Answer 1

你的意思是这样的：

<ul id="primarynav">
    <li><a href="">home</a></li>
    <li class="portfolio"><a href="">protfolio</a></li>
    <li><a href="">contact</a></li>
</ul>

<!-- Secondary nav -->

<ul id="secondarynav">
    <li><a href="">Websites</a></li>
    <li><a href="">Graphics</a></li>
    <li><a href="">Drawing</a></li>
</ul>


$(document).ready(function(){
    var $primarynav = $('#primarynav .portfolio'),
        $secondarynav = $('#secondarynav');

    $primarynav.hover(function(){
        $secondarynav.addClass('highlight');
    });

    $secondarynav.hover(function(){
        $secondarynav.removeClass('highlight);
    });
});

• 它突出显示子导航当悬停主导航
• 时，在离开主导航
• 时不取高亮显示，当悬停子菜单

时高亮显示消失