jQuery中如何終止動畫
- 清浅原創
- 2019-01-25 11:06:493976瀏覽
可以直接使用stop()函數來立即停止目前正在進行的動畫，這樣做的目的在於防止前一個動畫影響後面動畫的效果
在jQuery中可以透過stop()方法來終止動畫。它一般用於兩個動畫間的切換。因為有時滑鼠滑動的過快會導致動畫效果與滑鼠的動作不一致，這時就需要stop（）來停止動畫。接下來在文章中將透過具體實例告訴大家如何使用stop方法
#【推薦課程：##jQuery教學】
stop() 方法適用於所有jQuery 效果函數，包括滑動、淡入淡出和自訂動畫等它有兩個參數為stopAll、 goToEnd stopAll表示是否應該清除動畫佇列。預設是 false，即僅停止活動的動畫，允許任何排入佇列的動畫向後執行goToEnd 表示是否立即完成目前動畫。預設是 false。 因此，預設地，stop() 會清除在被選元素上指定的目前動畫<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#flip").click(function(){
$("#panel").slideDown(5000);
});
$("#stop").click(function(){
$("#panel").stop();
});
});
</script>
<style type="text/css">
#stop{
margin-bottom:10px;
}
#panel,#flip
{ width:200px;
padding:5px;
text-align:center;
background-color:pink;
border:solid 1px #ccc;
}
#panel
{
display:none;
}
</style>
</head>
<body>
<button id="stop">停止滑动</button>
<div id="flip">点击向下滑动</div>
<div id="panel">停止动画</div>
</body>
</html>
效果圖：
以上是jQuery中如何終止動畫的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
上一篇：Angular框架的優勢是什麼下一篇：Angular框架的優勢是什麼