此方法用于对队列中的下一项的执行设置延迟
实例:
<!DOCTYPE html>
<html lang=‘zh-cn‘>
<head>
<title>Insert you title</title>
<meta http-equiv=‘description‘ content=‘‘.animation‘ is my page‘>
<meta http-equiv=‘keywords‘ content=‘keyword1,keyword2,keyword3‘>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type=‘text/javascript‘ src=‘./js/jquery-1.12.1.min.js‘></script>
<style type="text/css">
*{margin:0;padding:0;}
html{font:400 13px/1.2em ‘Courier New‘;color:#000;}
.animation{width:100px;height:100px;background:red;border-radius:2px;text-align:center;line-height:100px;color:#FFF;}
button{background:#FF9E6B;padding:8px 16px;border:0;outline:none;-webkit-outline:none;margin-bottom:15px;font:400 13px/1.2em ‘Courier New‘;color:#FFF;border-radius:2px;}
</style>
<script type=‘text/javascript‘>
$(function(){
$(‘.start‘).click(function(){
$(‘.animation‘).animate({‘width‘:‘100px‘,‘height‘:‘100px‘,},0,‘linear‘);
$(‘.animation‘).delay(1800).animate({‘width‘:‘150px‘,},1500,‘linear‘);
$(‘.animation‘).delay(3200).animate({‘height‘:‘150px‘,},1500,‘linear‘);
$(‘.animation‘).animate({‘width‘:‘450px‘,‘height‘:‘300px‘,},1500,‘linear‘);
});
$(‘.stop‘).click(function(){
$(‘.animation‘).stop(true,true);
});
});
</script>
</head>
<body>
<button class=‘start‘>start</button>
<button class=‘stop‘>stop</button>
<div class=‘animation‘>stop()及参数</div>
</body>
</html>
时间： 2025-01-15 12:57:36