If you need to remove a function from the queue, then you can call dequeue() jQuery method.

jQuery deQueue()

The dequeue() is a jQuery inbuilt method, which is used to remove the next function from the queue and then executes the function. You have to make sure that the dequeue() is called only after adding a function with queue, to allow the process to continue.

General Syntax of jQuery deQueue()

selector.deQueue(queueName);

In this jQuery deQueue() syntax, the parameter queueName is an optional argument that specifies the name of the queue. The default value is fx, the standard effects queue.

jQuery deQueue() Example

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script> 
$(document).ready(function(){
  $("#start").click(function(){
    var div = $("div");  
    div.animate({height: 300}, "slow");
    div.animate({width: 300}, "slow");
    div.queue(function(){
      div.css("background-color", "red");  
      div.dequeue();
    });
    div.animate({height: 100}, "slow");
    div.animate({width: 100}, "slow");
  });
});
</script> 
</head>
<body>
<p><button id="start">Start Animation</button></p>
<div style="background:blue;height:100px;width:100px;">
</div>
</body>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *