Detailed explanation of usage examples of clearQueue() in jQuery-JS Tutorial-php.cn

Detailed explanation of usage examples of clearQueue() in jQuery

巴扎黑

Release： 2017-06-20 14:47:33

Original

989 people have browsed it

This article mainly introduces the usage of clearQueue() method in jQuery. It analyzes the function, definition and techniques of clearQueue() method with examples. It has certain reference value. Friends who need it can refer to it

The example in this article describes the usage of the clearQueue() method in jQuery. Share it with everyone for your reference. The specific analysis is as follows:

This method can clear all queues on the object that have not yet been executed.

If there are no parameters, the animation queue will be cleared by default. This is similar to stop(true), but stop() can only clear the animation queue, while this can clear all queues created through queue().

Grammar structure:

The code is as follows:

$(selector).clearQueue(queueName)

Copy after login

Parameter list:

Parameters	Description
##queueName	Optional. Defines the name of the queue to stop. The default is "fx", animation queue.

Example code:

The code is as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>脚本之家</title>
<style type="text/css">
#father 
{
  background:#060;
  width:300px;
  height:300px;
}
#box 
{
  background:red;
  height:50px;
  width:50px;
  
position
:relative
}
</style>
<script type="text/
javascript
" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">  
$(
document
).ready(function(){ 
  $("#start").click(function(){ 
    $("#box").animate({height:200},"slow"); 
    $("#box").animate({width:200},"slow"); 
    $("#box").animate({height:50},"slow"); 
    $("#box").animate({width:50},"slow"); 
  }); 
  $("#clear").click(function(){ 
    $("#box").clearQueue(); 
  }); 
}); 
</script>
</head>
<body>
<p>
  <button id="start">开始执行动画</button>
  <button id="clear">清除队列</button>
</p>
<p id="father">
  <p id="box"></p>
</p>
</body>
</html>

Copy after login

The above is the detailed content of Detailed explanation of usage examples of clearQueue() in jQuery. For more information, please follow other related articles on the PHP Chinese website!