Combining multiple jQuery animations?

Question

I have a couple of jQuery animations running in a sequence after certain resources are loaded:

$(".loading").delay(2600).fadeOut({
 useTranslate3d: true,
});
$(".zip").delay(1900).slideDown({
 useTranslate3d: true,
});
$("#zip").delay(2800).slideDown({
 useTranslate3d: true,
});

Is there a better way to combine all of these animations? It feels superfluous having to write them all out like this...

Answer 1

You can use the same options object for all three animations.

var opts = {
 useTranslate3d: true,
}
$(".loading").delay(2600).fadeOut(opts);
$(".zip").delay(1900).slideDown(opts);
$("#zip").delay(2800).slideDown(opts);

Having .zip and #zip pointing to different elements might also be a bit confusing - but that depends on your DOM structure.

• Charlie: Yeah, I'll worry about the naming later.