jQuery悬停在不同的div上淡入/淡出

Question

我在名为header的div中有一个列表，我想在将鼠标悬停在每个列表上时扩展列表，但我希望所有悬停的列表保持打开状态，直到将鼠标移出header div。 到目前为止，我已经为每个列表单独设置了fadIn / fadeOut，或者我可以让每个列表都进行fadeIn并保持打开状态，但是每当我移出div时都不会褪色。

这是我正在使用的代码： http : //jsfiddle.net/jTCdg/11/

在javascript中注释掉的行是所有列表保持可见或悬停时列表fadeIn / fadeOut之间的变化。

这是我第一次使用javascript，因此非常感谢您的帮助。 谢谢

Answer 1

jQuery 悬停是mouseenter和mouseleave事件处理程序的快捷方式。 您可以分别定义两者。

$(document).ready(function() {
    $("#header ul").mouseenter(function() {
        $(this).find("li").fadeIn();
    });
    $("#header").mouseleave (function() {
        $(this).find("li").fadeOut();
    });
});

另请参阅更新的jsfiddle 。