jQuery finish() 方法使用示例

jQuery 中的 finish() 方法用於停止當前執行的動畫效果。它會刪除所有排隊的動畫效果並完成所選元素的所有動畫效果。

語法

語法如下 −

$(selector).finish(queue)

以上的佇列引數是停止動畫效果的佇列名稱。

示例

現在，我們來看一個實現 jQuery finish() 方法的示例 −

<!DOCTYPE html>
<html>
<head>
<style>
   div {
      background:orange;
      height:200px;
      width:200px;
      padding: 5px;
   }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("#begin").click(function(){
         $("div").animate({height: 450}, 2000);
      });
      $("#end").click(function(){
         $("div").finish();
      });
   });
</script>
</head>
<body>
<h2>Let's perform Animation</h2>
<p>
<button id="begin">Begin</button>
<button id="end">End</button>
</p>
<div></div>
</body>
</html>