jQuery $ .animate () più elementi ma solo richiamare una volta la richiamata

Se selezioni una class o una raccolta di elementi da animare con jQuery:

$('.myElems').animate({....}); 

E poi usa anche la funzione di callback, finisci con un sacco di chiamate animate() inutili.

 var i=1; $('.myElems').animate({width:'200px'}, 200, function(){ //do something else $('#someOtherElem').animate({opacity:'1'}, 300, function(){ if (i>1) console.log('the '+i+'-th waste of resources just finished wasting your resources'); i++; }); }); 

Probabilmente questo è solo cattivo codice e / o design – ma c’è qualcosa che posso fare che entrambi evitano di avere molte chiamate animate() con solo uno di loro usando il callback, e avendo un carico di callback inutili in esecuzione e avvitamento con il mio codice / comportamento previsto?

Idealmente, sarei in grado di codificare un singolo callback “usa e getta” che verrà eseguito una sola volta, altrimenti forse c’è un modo efficace per verificare se qualcosa è già stato animato da jQuery?

Esempio: http://jsfiddle.net/uzSE6/ (avviso – questo mostrerà un carico di caselle di avviso).