jQuery - 如果光标没有进入任何兄弟姐妹，则仅调用悬停功能

Question

我正在尝试创建与此网站上的导航类似的效果：http://rogwai.com/。我在这jsFiddle中的表现非常接近。

如果你一次徘徊在一个li（即从底部），它的工作正常。但是，如果您在每个列表项中水平滑动，则“跟随者”会在每个悬停的项目之后返回到活动位置或末尾的幻灯片。相反它应该跟随鼠标。

查看悬停时执行的代码，这是完全可以理解的。我无法理解的是，当鼠标完全离开菜单时，如何让它只返回活动位置或滑出结束。

希望这是有道理的 - 你应该直接从jsFiddle看到问题。

提前致谢。

Answer 1

您可以做的是将mouseenter部分添加到li，但将mouseleave部分放在整个ul上。这样，只有当您将鼠标移出整个ul时才会触发。

http://jsfiddle.net/YZr5b/6/

$('nav.block-system-main-menu ul li:not(.follower)').mouseenter(function() {
    followerMove($(this));
});

$('nav.block-system-main-menu ul').mouseleave(function(){
    followerMove($active);
});

注意，如果你真的使用的是jquery 1.2.6（相当旧），你需要稍微修改一下mouseenter并且mouseleave不存在。