0

我无法弄清楚如何将 mouseout() 绑定到我的整个导航栏，包括链接。

当用户将鼠标悬停在#nav 中的链接上时，会显示一个子菜单。一切都很好。

我想要做的是当用户将鼠标悬停在整个#nav之外时淡出该子菜单。

我的鼠标移出代码：

$('#nav').mouseout(function() {
  setTimeout(function() {
   //$('.sub-link').fadeOut();
  }, 2000);
});

当我将鼠标悬停在#nav 中的锚链接上时，我看到了子菜单。然后我猜 mouseout() 甚至会触发并且子菜单会淡出。无论如何，有没有#nav和其中的任何锚链接作为一个？

我会粘贴我的标记，但即使缩进 4 个空格仍然显示为呈现的 html..

示例页面：http ://chrisparaiso.com/test/

4

2 回答 2

1

mouseleave()应该是你需要的：

$('#nav').mouseleave(function() {
  setTimeout(function() {
   $('.sub-link').fadeOut();
  }, 2000);
});

从文档中：

另一方面，mouseleave 事件仅在鼠标离开其绑定的元素时触发其处理程序，而不是后代。

mouseout如果光标位于您将事件绑定到的元素内的元素上，您是对的。但mouseleave实际上只有当光标离开 while 元素时才会触发。

这个例子mouseleave()非常展示了和之间的区别mouseout()。

于 2010-04-05T18:30:20.367 回答
0

尝试使用像这样的选择器$('#nav, #nav > a')

于 2010-04-05T18:29:31.403 回答