关于mouseenter的联合jquery

Question

我有一个Nav，它有一个下拉子菜单。当下拉菜单出现时，我希望菜单+下拉结合如下：

这样如果鼠标以粉红色退出整个块，则子导航消失。目前，如果鼠标仅退出下拉列表，则下拉列表将消失。 我看到了this example但是将课程结合在一起并不适合我。

这是MY FIDDLE

Answer 1

为什么不从mouseenter和mouseleave的目标中删除子类？像this：

var animate;
$(".myClass").mouseenter(function () {
  clearTimeout(animate);
  $('.myClass').css('background-color','#777');
  $('.mySubClass').css('display','inline');
});
$(".myClass").mouseleave(function() {
  animate = setTimeout(function(){
    $('.myClass .mySubClass').css('display','none');
    $('.myClass').css('background-color','#49616a');
  }, 800);
});​

...作为.myClass覆盖区域已经是菜单和删除的联合（因为相应的元素包括链接和下拉菜单）。

我在这里修复了另一个潜在的错误：可能对mouseleave-mouseenter事件进行过快的排序，然后即使它不应该（因为光标停留在菜单区域中）也会触发超时功能。为了防止这种情况，添加了一个额外的变量（animate）;它将超时存储在mouseleave处理程序中，并在“mouseenter”处理器中清除它。