.dequeue()

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

.dequeue(queueName)🡢 jQuery

queueName StringA 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.

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

JS
<button>Start</button>
<div></div>
CSS
div {
  margin: 3px;
  width: 50px;
  position: absolute;
  height: 50px;
  left: 10px;
  top: 30px;
  background-color: yellow;
}
div.red {
  background-color: red;
}
HTML
$("button").click(function () {
  $("div")
    .animate({ left: "+=200px" }, 2000)
    .animate({ top: "0px" }, 600)
    .queue(function () {
      $(this).toggleClass("red").dequeue();
    })
    .animate({ left: "10px", top: "30px" }, 700);
});
DEMO

Looking for a Web Developer?

👋

Hi! I'm Basti, author of this site. If you are looking for a web developer with 15+ years of experience, holla at me!

Be it the good 'ol jQuery, vanilla JS or modern frameworks like Vue and Svelte, front- or backend, I can help you.

Just write me at jobs@jqapi.com :)