jQuery stop()

Introduction

Stop the currently running animation:

<!DOCTYPE html>
<html>
<head>
<script 
 src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>//from  ww w.j a v  a  2  s.c o m
<script>
$(document).ready(function(){
  $("#start").click(function(){
    $("div").animate({height: 300}, 3000);
    $("div").animate({width: 300}, 3000);
  });
  $("#stop").click(function(){
    $("div").stop();
  });
});
</script>
</head>
<body>

<p>
<button id="start">Start Animation</button>
<button id="stop">Stop Current Animation</button>
</p>

<div style="background:red;height:100px;width:100px"></div>

</body>
</html>

The stop() method stops the currently running animation for the selected elements.

$(selector).stop(stop_all,go_to_end)

Parameter	Optional	Type	Description
stop_all	Optional.	Boolean value	whether to stop the queued animations as well. Default is false
go_to_end	Optional.	Boolean value	whether to complete all animations immediately. Default is false

Previous Next