Detailed explanation of jQuery stop() function-JS Tutorial-php.cn

Detailed explanation of jQuery stop() function

巴扎黑

Release： 2017-06-30 11:33:06

Original

1567 people have browsed it

For the stop() function, there are two parameters that can be filled in the brackets.

The prototype of the stop() function is like this: stop(stopall, finish); stopall and finish are its two parameters, and their values are true or false.

If the value of stopall is true, all actions in the animation queue will be stopped. Otherwise, only the current action will be stopped, and the next action in the animation queue will be carried out.

If the value of finish is true, the current action will immediately jump to the end and then stop (no matter what progress the current action reaches) (finish is studied separately here, and stopall is not involved, so only the current action is discussed, not animation. the next action in the queue), otherwise the current action will stop at its progress and will not jump to the end.

The default values of stopall and finish are both false, and stop(true) is equivalent to stop(true, false)

Finally, the code is provided for debugging

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <style>
   p
   {
    height:200px;
	width:200px;
	background-color:#99ff99;
	position:relative;
   }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script>
  $(document).ready(function(){
   $("#start").click(function(){
	   $("#a1").animate({left:"400px"},5000);
	   $("#a1").animate({top:&#39;400px&#39;},5000);
	   $("#a1").animate({left:"0px"},5000);
	   $("#a1").animate({top:"0px"},5000);
   });
   $("#end").click(function(){
	   $("#a1").stop(false,true);
   });
  });
  </script>
 </head>
 <body>
  <button id="start">开始动画</button>
  <button id="end">停止</button>
  <p id="a1"></p>  
 </body>
</html>

Copy after login

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