jquery - 阻止 fadeToggle() 建立

Question

当我将鼠标悬停在想要淡入和淡出的内容上多次时，它就会不断重复。即使我停止悬停它。我怎样才能阻止这个？

$(".featured").hover(function(){
    $(this).find("h3").fadeToggle(800);
   });

Answer 1

您需要调用.stop()

$(this).find("h3").stop(true, true).fadeToggle(800);

参数表示:clearQueue、jumpToEnd
这几乎会立即停止当前动画。为了更平滑地停止，您应该调用 .stop(true, false)

我能想到的另一种方法是检查元素是否有动画:

$(".featured").hover(function(){
    var $h3 = $(this).find('h3');

    if(!$h3.is(':animated') ) 
        $h3.fadeToggle(800);
});

引用:.stop() , :animated selector