jQuery animation() - complete firing too soon

Question

I wrote a little animation script that fades a set of stripes from left to right. After all animations are complete a callback functions shoud run.

The script is here:

http://jsfiddle.net/9zkbu/

It works fine, but I want to do the same for a right-to-left animation:

http://jsfiddle.net/FTrhX/

As you can see the callback function is fired before animation ends :( The only thing I changed is the delay(). What am I doing wrong here? Why is "complete" running before all animations finish?

Answer 1

You are almost there, you did reverse the direction, but forgot on the callback to also account for the reversal. Doing this works for me:

complete: (i == 0) ? function(){alert('done');} : null

Because you are counting the other direction if you try and check complete at cols - 1 you'll get it too early, you need to get it at 0 here. try this one: http://jsfiddle.net/FTrhX/8/