鼠标事件的动画如何按顺序发生？

Question

我在某些元素中有一些鼠标事件，如下所示。

$("div").on("mouseenter mouseleave", function(){
    $(this).toggleClass("bigDiv", 1000);
});

问题是：如果触发了两个或更多鼠标事件，它们将不等待先前的完成事件触发，而是立即触发。 他们如何等待时间？

提前致谢。

Answer 1

试试看：

jQuery(function($) {
    $("div").on("mouseenter", function(){
        if(!$('div').is(':animated'))
            $(this).addClass("bigDiv", 1000);
    });

    $("div").on("mouseleave", function(){
        $(this).removeClass("bigDiv", 1000);
    });
});

这就是你想要的吗？

JSFiddle