jQuery Tutorial
jQuery Queue: queue() Method in jQuery
jQuery queue() Method
jQuery includes animation queue capabilities by default.
If you write numerous animation()
calls in a row, jQuery will establish an "internal" queue with them. The animated calls are then executed one by one.
So, if you want to do multiple animations after each other, you can use the queue feature:
Example 1
$("button").click(function(){
var div = $("div");
div.animate({height: '300px', opacity: '0.4'}, "slow");
div.animate({width: '300px', opacity: '0.8'}, "slow");
div.animate({height: '100px', opacity: '0.4'}, "slow");
div.animate({width: '100px', opacity: '0.8'}, "slow");
});
The following example shifts the
element to the right before increasing the text's font size:
Example 2
$("button").click(function(){
var div = $("div");
div.animate({left: '100px'}, "slow");
div.animate({fontSize: '3em'}, "slow");
});