SlideOut后下拉菜单截止

Question

我正在使用下拉菜单，我使用onmouseover和onmouseout修改了使用SlideOut和FadeIn等动画。 将鼠标悬停在所有嵌套列表上几次后，问题就出现了，这导致第二个嵌套列表被切断。
您可以通过从“nav 1”移动到“nav 2”并快速返回来复制错误。

Link to jsFiddle

截止屏幕截图：
http://dl.dropbox.com/u/53879403/screenshot.png
请感谢您的任何建议/批评。

Answer 1

请看这个小提琴：http://jsfiddle.net/SuRJ9/

我改变的代码：

function slideDown(toSlide) {
    currentHover(toSlide);
    $($(toSlide).children('ul')[0]).slideDown('medium',
        function(){   $(this).css('overflow','visible') });
}

我在完成动画后添加了重置overflow到visible。 <{1}}由jQuery设置为overflow，以便制作滑动动画。

此外，请不要使用hidden和onmouseout="slideUp(this)"，这是一种突兀的JavaScript，并且是一种糟糕的技术。您应该使用jQuery分配这些事件。

Answer 2

$.fadeOut/In()在运行动画之前应用某些样式。这些在动画完成时被删除。

你的fadeOutNav()正在调用stop（true），如果在fadeOut（）或fadeIn（）工作时完成，将保留它们已应用于元素的样式。在这种情况下溢出：隐藏在父ul上。您可以删除停止并让效果冒泡，或将.css('overflow','')插入链中。