Question

I have this code:

jQuery('#flash').animate({opacity: 0.35}, 200)
                .animate({opacity: 0}, 200)
                .animate({opacity: 0.35}, 200)
                .animate({opacity: 0}, 200)
                .animate({opacity: 0.35}, 200)
                .animate({opacity: 0}, 600)

and I’m not decided on how many times I want its state altered. Is there a way to chain animations programmatically instead having to add/remove chain elements by editing the animate chain?

Answer 1

No, you can’t chain animations without editing the animation queue. If you want to chain a variable, but limited number of times you can do easily with a loop:

var flash = $("#flash");
for (var i=0; i<n; i++)
    flash.animate({opacity: 0.35}, 200).animate({opacity: 0}, 200);

If you want an endless loop, or one that stops when a condition is to be fulfilled in the future, you want to hook a callback on the animation queue, restarting the function:

var flash = $("#flash");
function anim() {
    // if (condition)
    flash.animate({opacity: 0.35}, 200).animate({opacity: 0}, 200, anim);
                                            // call "recursively": ^^^^
}
anim();