Question

I got bunch of LI elements animating (slideDown) inside UL. After LI finish their animation I want to add A-HREF element below UL.

There is a problem – if I use

$('li').animate(SPEED, callback)

to wait for LIs finish its animation, my callback will be called n-times (n = count LI) – if I have 20 LIs, 20 A-HREFs will be added bellow UL. I need onlt one A-HREF, in the other words, I need to wait, until LI finish theirs animation and then fire ONE callback.

Any idea?

Answer 1

try,

$('li').animate(SPEED, callback);

callback = function(){
   if ($(this).siblings(':animated').length < 1) { // check if other li's are still animating...
      // do parent animation or anything here...
   }
}