Question

I have a jquery animation which contains about 300x functions as this one playing one after the other as a sequence:

$(".block").animate({"left": "+=50px"}, "slow");

1) How is it possible, by clicking on an anchor , to pause the whole thing and start it from where it was paused when clicking again (and not from the beginning)?

2) On another hand, say I have these for instance:

$(".block").animate({"left": "+=50px"}, "slow");
$(".block").animate({"right": "+=50px"}, "slow");
$(".block").animate({"top": "+=50px"}, "slow");...(x100)

How can I make them play one after the other without putting them as callbacks (I generate them via PHP and it would be kind of hard to generate them as callbacks of one another since there are more than 300 in total)?

Answer 1

To answer 2), you can chain them like this:

a = $(".block");
a = a.animate({"left": "+=50px"}, "slow");
a = a.animate(...)
etc...

example: http://jsfiddle.net/NwXMT/3/