jQuery | dequeue() with Examples

The dequeue() is an inbuilt method in jQuery which is used to remove the next function from the queue and then it will execute the function. In a queue there will be a several function waiting to run dequeue() used to remove the top function from the queue and execute that function.


Parameter: It accepts a parameter “name” which specifies the name of the queue.
Return Value : It returns the selected element that perform the given top function.

jQuery code to show the working of this function:

Code #1:
In the below code, animate method is also used to demonstrate the dequeue method.

         div {
         margin: 15px 0 0 0  ;
         width: 100px;
         position: absolute;
         height: 30px;
         left: 10px;
         top: 30px;
         background-color: lightgreen;
         text-align: center;
         padding: 15px;
         div.red {
         background-color: red;
      <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
      <!-- click on this button to perform animation -->
      <button>Click to start !</button>
         $( "button" ).click(function() {
         <!--jQuery code to demonstrate animation with the help of dqueue method-->
           $( "div" )
             .animate({ left:"+=500px" }, 1000 )
             .animate({ top:"0px" }, 1000 )
             .queue(function() {
             .animate({ left:"50px", top:"150px" }, 1000 );

Before clicking the “Click to start” button-

After clicking the “Click to start” button-

This article is attributed to GeeksforGeeks.org

You Might Also Like

leave a comment



load comments

Subscribe to Our Newsletter