Rumah > Artikel > hujung hadapan web > jQuery中如何终止动画
jQuery中如何终止动画
- 清浅asal
- 2019-01-25 11:06:493932semak imbas
可以直接使用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>效果图：
总结：以上就是本篇文章的全部内容了，希望通过这篇文章可以帮助大家学会终止动画的方法。
Atas ialah kandungan terperinci jQuery中如何终止动画. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Angular框架的优势是什么Artikel seterusnya：bootstrap教程整理-起步+CSS基础