防止 jQuery 动画队列

Question

我在不同的上下文中找到了同一个问题的许多答案。我希望在以下代码中添加“.stop”以防止动画队列堆积：

 //Top Mailing List Drop down animation
 $(document).ready(function() {

$('#top_mailing_hidden').hide();

 jQuery('#top_mailing')
   .bind("mouseenter",function(){
  $("#top_mailing_hidden").slideDown('slow');
 }).bind("mouseleave",function(){
  $("#top_mailing_hidden").slideUp('slow');
 });

});

Answer 1

只需要在开始下一个动画之前添加它

$(document).ready(function() {

var top_mailing_hidden = $('#top_mailing_hidden').hide();
$('#top_mailing').bind("mouseenter",function(){
    top_mailing_hidden.stop().slideDown('slow');
}).bind("mouseleave",function(){
    top_mailing_hidden.stop().slideUp('slow');
});

});

不过，您可能会查看hoverintent jQuery plugin，这有助于使这样的事情不那么生涩。