jQuery API

.dequeue()

.dequeue( [ queueName ] ) Returns: jQuery

Description: Execute the next function on the queue for the matched elements.

  • version added: 1.2.dequeue( [ queueName ] )

    queueNameA string containing the name of the queue. Defaults to fx, the standard effects queue.

When .dequeue() is called, the next function on the queue is removed from the queue, and then executed. This function should in turn (directly or indirectly) cause .dequeue() to be called, so that the sequence can continue.

Example:

Use dequeue to end a custom queue function which allows the queue to keep going.

<!DOCTYPE html>
<html>
<head>
  <style>
  div { margin:3px; width:50px; position:absolute;
  height:50px; left:10px; top:30px; 
  background-color:yellow; }
  div.red { background-color:red; }  
</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
	<button>Start</button>  
<div></div>
<script>
$("button").click(function () {
  $("div").animate({left:'+=200px'}, 2000);
  $("div").animate({top:'0px'}, 600);
  $("div").queue(function () {
    $(this).toggleClass("red");
    $(this).dequeue();
  });
  $("div").animate({left:'10px', top:'30px'}, 700);
});
</script>
</body>
</html>

Demo:

Comments

  • Support requests, bug reports, and off-topic comments will be deleted without warning.

  • Please do post corrections or additional examples for .dequeue() below. We aim to quickly move corrections into the documentation.
  • If you need help, post at the forums or in the #jquery IRC channel.
  • Report bugs on the bug tracker or the jQuery Forum.
  • Discussions about the API specifically should be addressed in the Developing jQuery Core forum.