前言：
现在各位老铁们对“jquery暂停执行”都比较珍视，我们都想要知道一些“jquery暂停执行”的相关知识。那么小编同时在网上汇集了一些对于“jquery暂停执行””的相关内容，希望姐妹们能喜欢，咱们快快来学习一下吧！jQuery动画效果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>48-jQuery的stop和delay方法</title>
<style type="text/css">
*{
margin: 0; /*外边距：0*/
padding: 0; /*内边距：0*/
}
.one{
width: 100px; /*宽：100*/
height: 100px; /*高：100*/
background: red; /*背景：红色*/
}
.two{
width: 500px; /*宽：500*/
height: 10px; /*高：10*/
background: #063EC0; /*背景：蓝色*/
}
</style>
<script src="../static/js/jquery-3.6.0.js"></script>
<script type="text/javascript">
$(function(){
// $('button').eq(0).click(function(){ // 当点击开始动画按钮时
// $('.one').animate( // 找到红色div调用自定义动画
// {marginLeft: 400}, 3000) // 用3秒时间 左边距调到400
// $('.one').animate( // 找到红色div调用自定义动画
// { height: 30}, 3000) 用3秒时间 高度调到400
// })
$('button').eq(0).click(function(){ // // 当点击开始动画按钮时
$('.one').animate( // 找到红色div调用自定义动画
{marginLeft: 400}, 3000 // 用3秒时间 左边距调到400
).delay(1000).animate( // 等待1秒 调用自定义动画
{ height: 30}, 3000 // 用三秒高度调到30
).animate({ height: 50}, 3000 // 用三秒高度调到50
).animate({marginLeft: 0}, 3000 // 用三秒 左边距调到0
).animate({width: 50}, 3000) // 用三秒 宽度调到50
})
$('button').eq(1).click(function(){
// 立即停止当前的，继续执行后续的动画
// $('div').stop()
// $('div').stop(false)
// $('div').stop(false,false)
// 立即停止当前的和后续的所有的动画
// $('div').stop(true)
// $('div').stop(true, false)
//立即完成当前的，继续完成后续的
// $('div').stop(false, true)
// 立即完成当前的， 并且停止后续所有的动画
$('div').stop(true, true)
})
})
</script>
</head>
<body>
<button>开始动画</button>
<button>结束动画</button>
<div class="one"></div>
<div class="two"></div>
</body>
</html>
标签： #jquery暂停执行
