Kolejki animacji jQuery w wielu elementach

Question

To pytanie jest podobne do this one about animation queues, ale odpowiedzi w tym wątku są bardzo szczegółowe i nie są łatwe do uogólnienia.

W mojej aplikacji internetowej, wiadomości są przekazywane z powrotem do użytkownika (z informacją pudełka, ostrzeżenia Błędy & itp) poprzez wyprowadzanie div z class="alert" np

<div class="alert">Login successful</div> 
<div class="alert">You have new messages waiting</div> 

Nie może być dowolna liczba wpisów na stronę, w zależności od tego, co robi użytkownik.

Chciałbym użyć animacji jQuery do sekwencyjnego wyświetlania każdego z pól alertów: po zakończeniu jednej animacji rozpoczyna się następna.

odpowiedzi w tym drugim pytaniu powiedział użyć zwrotnego jak:

$('#Div1').slideDown('fast', function(){ 
    $('#Div2').slideDown('fast'); 
}); 

tym wyjątkiem, że nie będzie działać, jeśli nie ma nieznaną liczbę div animować. Ktoś wie, jak to osiągnąć?

Answer 1

Wpadłem na pomysł, choć mam podejrzenia, że ​​ktoś, kto wie więcej o zamknięciach JS, może mieć dla mnie kilka wskazówek.

nextAnim($('.alert')); 

function nextAnim($alerts) { 
    $alerts 
     .eq(0) // get the first element 
     .show("slow", 
      function() { 
       nextAnim($alerts.slice(1)); // slice off the first element 
      } 
     ) 
    ; 
} 

Answer 2

Jest to dość łatwe do skonfigurowania:

// Hide all alert DIVs, then show them one at a time 
$(function() 
{ 
    var alerts = $(".alert").hide(); 
    var currentAlert = 0; 
    function nextAlert() 
    { 
     alerts.eq(currentAlert).slideDown('fast', nextAlert); 
     ++currentAlert; 
    } 
    nextAlert(); 
}); 

Można chyba zrobić prosty sposób wtyczki z tego, czy jest to coś będziesz używać dużo.