jQuery queue() with Examples

jQuery Web Development Front End Technology

The queue() method in jQuery is used to display the queue of functions to be executed on the selected elements.

Syntax

The syntax is as follows −

$(selector).queue(queue)

Above, the parameter queue is the name of the queue.

Example

Let us now see an example to implement the jQuery queue() method −

Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("button").click(function(){
         var div = $("div");
         div.animate({height: 250}, "slow");
         div.animate({left: "+=200",top: "+=100" }, "slow");
         $("span").text(div.queue().length);
      });
   });
</script>
<style>
div {
   width:100px;
   height:100px;
   position:absolute;
   left:10px;
   top:100px;
   background-color:orange;
}
</style>
</head>
<body>
<button>Begin</button>
<p>Length = <span></span></p>
<div></div>
</body>
</html>