Jquery导航菜单未按预期运行

我用Jquery创建了一个相当传统的3级水平下拉导航菜单。然而，它并没有将第三层偏移到第二层的侧面，而是打开了手风琴风格。第三层的关闭在鼠标离开后被延迟，以防止它在周围跳得太多

我只有一个问题要解决。当有人打开第三层，然后返回到不同的第一层按钮，然后返回到原始的第一层按钮时，第三层仍然打开

你可以从中看到这一点。 盘旋在西班牙和安达卢西亚，将开启第三关（科尔多瓦等）。如果你随后去了摩洛哥并迅速返回西班牙，第三关将立即开放

我试过各种方法，比如

   $(".nav1").hoverIntent( 
        function(){//onmouseover 
            $(this).children("ul").slideDown(1000);
            $(".nav2").children("ul").hide(); 
        }, 

但它们都不起作用。有什么建议吗

解决方案 随后，我发现我最初的努力有一个变化，但确实奏效：

   $(".nav1").hoverIntent( 
        function(){//onmouseover 
            $(".nav2").children("ul").hide(); 
            $(this).children("ul").slideDown(1000);
        }, 

当鼠标移动到2级列表中的其他位置时，需要.delay（3000）来停止第三级关闭。事实上，我已经发现。延迟（8000）似乎是正确的设置

hoverIntent对于阻止下拉列表以不受欢迎的方式四处移动非常有用。到目前为止，我使用默认设置，但我认为它需要一点调整。当你第二次回到2级列表中的同一个位置时，这似乎是非常有害的，所以3级是非常不愿意打开的

---

感谢那些回复者。

您的第一期仅是CSS的一期。您的小提琴中有一些嵌套语句，这可能是问题的根源

您的第二个问题可能是因为您没有正确处理handlerOut事件

---

将代码更改为：

$(".nav1").hover( 
    function(){//onmouseover 
        $(this).children("ul").slideDown(1000); 
    }, 
    function(){//onmouseout 
        $(this).children("ul").slideUp(1000).children("ul").hide(); 
}); 

隐藏已向上滑动的level 2元素的子元素

---

不确定这是您想要的，但当您将

.nav2的
ul
鼠标移出时，尝试删除
.delay（3000）

另外，在开始新动画之前，使用jQuery结束当前动画

$(this).children("ul").stop(true, true).slideDown(1000);