キュー内のすべてのアニメーションの最後にジャンプするjQuery stop（true、true）

Question

jQueryのstop(true, true)メソッドを使用して、実行中のアニメーションを消去してすぐに次のアニメーションが開始されました。私は、最初のパラメータclearQueueがアニメーションキュー全体をクリアするが、2番目のパラメータjumpToEndは、現在実行中のアニメーションの終わりにジャンプし、キューから削除されたアニメーションにジャンプしないことに気づいた。それをクリアして、キューに入れられたすべてのアニメーションの最後にジャンプする方法はありますか？

代わりに、stop(false, true)の呼び出しを連鎖させることになりましたが、これはたとえば3つのキューに入れられたアニメーションしか処理しません。

$(this) 
    .stop(false, true) 
    .stop(false, true) 
    .stop(false, true) 
    .addClass('hover', 200); 

編集：私は他の誰かが、これは重宝願ってい

$.fn.extend({ stopAll: function() { 
    while (this.queue().length > 0) 
     this.stop(false, true); 
    return this; 
    } }); 

$(this).stopAll().addClass('hover', 200); 

：

ATES Goralの答えあたりのように私は私自身の方法、stopAllを、追加することになりました。

Answer 1

のjQuery 1.9は、まさにそれを実現.finish()方法を導入しました。

Answer 2

複数のstop(false, true)が連鎖しています。代わりに、連鎖呼び出しの固定数をハードコーディングで、あなたはキューの長さをチェックすることができ：

while ($(this).queue().length) { 
    $(this).stop(false, true); 
} 

デモ：http://jsfiddle.net/AB33X/

Answer 3

私はまた.finish()ドキュメントページ上の様々な方法の素敵なデモもあり

 
Animations may be stopped globally by setting the property $.fx.off 
to true. When this is done, all animation methods will immediately 
set elements to their final state when called, rather than displaying an effect. 

というjQueryの1.9で.finish（）メソッドのドキュメントから気づきます。

Answer 4

新しいアニメーションを開始する前に、クラスが存在するかどうかをテストします（ホバー時に設定され、mouseOutアニメーションコールバックで削除されます）。新しいアニメーションが開始すると、デキューします。

$("div").hover(function(){ 
    if (!$(this).hasClass('animated')) { 
     $(this).dequeue().stop().animate({ width: "200px" }); 
    } 
}, function() { 
    $(this).addClass('animated').animate({ width: "100px" }, "normal", "linear", function() { 
     $(this).removeClass('animated').dequeue(); 
    }); 
});