Question

我有一个鼠标悬停时激活的下拉菜单。它有一个动画，需要200ms完成，如果你关闭鼠标重新恢复200ms再次200ms。

如果你将鼠标放在下拉列表上然后快速关闭10秒，然后将鼠标移开，则下拉列表将不断下拉并重新启动，直到鼠标在下拉列表中完成它为止。

有谁知道如何解决这个问题？

var dropdown = function() {
    $('.dropdown').hover(function() {
        $('.inbutton').animate({
            top: '-188px'
        }, 200);
        $('.dr2button').animate({
            top: '0px'
        }, 200);
    }, function() {
        $('.inbutton').animate({
            top: '-122px'
        }, 200);
        $('.dr2button').animate({
            top: '-61px'
        }, 200);
    });
};


$(document).ready(dropdown);

Answer 1

将stop()功能预先挂到animate()

    $('.inbutton').stop().animate({
        top: '-122px'
    }, 200);

在所有动画功能中进行此操作。

更多信息：

https://api.jquery.com/stop/

JQuery悬停事件处理程序运行次数

1 个答案: