jQuery的悬停事件无法正常工作 [英] jquery hover event not working properly

问题描述

我有一个简单的水平菜单，当我将鼠标悬停在每个菜单项上时，子菜单就会向下滑动.因此，基本上，这是我们经常看到的典型导航菜单.我希望鼠标悬停时，子菜单在上，下滑动.我的问题是，如果我在各个项目之间移动鼠标的速度如此之快，就会出现多个子菜单保持可见的情况.我猜这是因为触发向上滑动时向下滑动尚未完成.有什么想法可以防止这种情况?这是我的代码:

I have a simple horizontal menu and when I hover each one of the items a sub menu slides down. So basically it is a typical navigation menu that we see so often. I want that when hovering the sub menu slides down and up when mouse out. My problem is that if I move the mouse so fast through the items it happens that more than one sub menu stays visible. I guess it's because the slide down was not finished when I trigger the slide up. Some idea to prevent this? Heres my code:

        $('#menu > li').hover(
                function () {
                    $('ul',$(this)).slideDown();
                },
                function () {
                    $('ul',$(this)).slideUp();
                }
            );

谢谢！

推荐答案

您应致电 ，然后在上下滑动之前，根据您的描述，还应为两个可选参数传递true，如下所示:

You should call stop before sliding up and down, and from your description, you should also pass true for both optional parameters like this:

$('ul',$(this)).stop(true, true).slideDown();

第一个参数(clearQueue)告诉jQuery清除动画队列，停止所有排队的动画.

The first parameter (clearQueue) tells jQuery to clear the animation queue, stopping any queued animations.

第二个参数(gotoEnd)告诉jQuery完成当前动画. (根据您想要的效果，您可能不需要此参数.)

The second parameter (gotoEnd) tells jQuery to complete the current animation. (This parameter might not be necessary in your case, depending on the effect you want.)

这篇关于jQuery的悬停事件无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！