jQuery queue & dequeue

 

These methods tend to come in pairs when you’re working within the animation queue.

When you use the animate and show, hide, slideUp, etc effect methods, you’re adding a job on to the fx queue.

By default, using queue and passing a function, will add to the fx queue. So we’re creating our own bespoke animation

 

step:

 

 

$('.box').animate({ height : 20 }, 'slow') .queue(function () { $('#title').html("We're in the animation, baby!"); }); 

 

As I said though, these methods come in pairs, so anything you add using queue, you need to dequeue to allow the process to continue. In the code above, if I chained more animations on, until I call $(this).dequeue(), the subsequent animations wouldn’t run:

 

$('.box').animate({ height : 20 }, 'slow') .queue(function () { $('#title').html("We're in the animation, baby!"); $(this).dequeue(); }) .animate({ height: 150 });