search

Home >Web Front-end >JS Tutorial >Detailed explanation of usage examples of clearQueue() in jQuery

Detailed explanation of usage examples of clearQueue() in jQuery

巴扎黑
巴扎黑Original
2017-06-20 14:47:331017browse

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)

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>


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!

Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：The usage difference between queue and dequeue in jQueryNext article：The usage difference between queue and dequeue in jQuery

Related articles

See more