jquery隊列/ .stop（）問題

Question

我有一些問題，使用.stop()來防止函數排隊。如果我使用.stop()或其變體，則該功能在hover:out後死亡，並且不會重新啓動。

你可以在這裏看到我的代碼和來源：http://joepolitic.com/zkmpract.html。只有最後一個菜單項（c）上有.stop()，其餘的都沒有。

$('li.contact').hover( 
function() { 
    $(this).stop().toggleClass('li contactb', 800); 
}, 
function() { 
    $(this).stop().toggleClass('li contactb', 800); 
} 
); 

Answer 1

該問題是由toggleClass工作的持續時間造成的。在動畫過程中，height直接設置在元素上。一旦動畫完成，height被刪除，並添加類。當您預先動畫stop動畫時，height會直接保留在覆蓋CSS類的元素上。這就是爲什麼它看起來不起作用，因爲如果有內聯樣式，添加和刪除類不會影響高度。

我認爲解決這個問題的唯一方法是不要直接使用toggleClass並使用animate。如果你不希望設置初始高度，你可以在data保存高度動畫之前，將其拉出，當你想將其設置回：

http://jsfiddle.net/yCAYw/1/

$("div").hover(function(){ 
    var $this=$(this); 

    $this.data("height",$this.height()); 
    $this.stop().animate({"height":"200px"},1000); 
},function(){ 
    var $this=$(this); 

    $this.stop().animate({"height":$this.data("height")},1000); 
});