Jquery，防止排队动画

Question

我有一个div，它将淡入/淡出悬停在页面上的另一个元素（并悬停在外）。麻烦的是，没有什么能够阻止用户真正快速地悬停并导致动画排队。

这里是我的代码：

<div class="hovertest">test</div> 

<div class="test">test2</div> 

的Jquery：

$("div.hovertest").hover(
     function() { 
     $(".test").fadeOut(); 
     }, 
     function() { 
     $(".test").fadeIn(); 
}); 

CSS：

div { 
    width:200px; 
    height:100px; 
    background-color:#B22; 
} 

这里是一个链接到jsfidde：http://jsfiddle.net/btEXH/

Answer 1

你想用个e stop函数并将clearQueue和jumpToEnd传递为true。

$("div.hovertest").hover(
    function() { 
    $(".test").stop(true, true).fadeOut(); 
    }, 
    function() { 
    $(".test").stop(true, true).fadeIn(); 
}); 

http://jsfiddle.net/infernalbadger/btEXH/1/