przystanek jQuery (true, true), aby przejść do końca wszystkich animacji w kolejce

Question

Używam stop(true, true) metody jQuery, aby usunąć animacje uruchomione więc następny rozpoczyna się natychmiast. Zauważyłem, że pierwszy parametr, clearQueue, czyści całą kolejkę animacji, ale drugi parametr, jumpToEnd, przeskakuje tylko do końca aktualnie uruchomionej animacji, a nie do tych, które zostały usunięte z kolejki. Czy istnieje sposób na to, aby było jasne i przeskoczyć do końca wszystkich animacji w kolejce?

Skończyło się na łańcuchach kilku wywołań stop(false, true) zamiast tego, ale to zajmie tylko 3 kolejki animacji, na przykład.

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

Edit:

skończyło się dodanie moje własne metody, stopAll, jak na odpowiedź Ates Goral za:

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

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

Mam nadzieję, że ktoś znajdzie to użyteczne.

Answer 1

jQuery 1.9 wprowadzono metodę .finish(), która osiąga dokładnie to.

Answer 2

Łańcuch wielokrotny stop(false, true) ma sens. Zamiast sztywnego kodowania stałą liczbę przykuty połączeń, można sprawdzić długość kolejki:

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

Demo: http://jsfiddle.net/AB33X/

Answer 3

ja również zauważyć z dokumentacji metody .finish() w jQuery 1.9 tego

 
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. 

Jest też ładny demo różnych metod na stronie .finish() dokumentacji.

Answer 4

testu na obecność grupy (ustawiony na aktywowaniu i usuwany po przesunięciu wskaźnika myszy animowanie zwrotnej), po czym nowa gapi animacji. Kiedy zaczyna się nowa animacja, usuń kolejkę.

$("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(); 
    }); 
});