.delay()
.delay( duration, [ queueName ] ) 返回: jQuery
描述: 设置一个延时来推迟执行队列中之后的项目。
-
version added: 1.4.delay( duration, [ queueName ] )
duration一个用于设定队列推迟执行的时间,以毫秒为单位的整数。
queueName一个作为队列名的字符串。默认是动画队列
fx
。
在jQuery1.4中性增加的,.delay()
方法允许我们将队列中的函数延时执行。它既可以推迟动画队列中函数的执行,也可以用于自定义队列
延时时间是以毫秒为单位的,数值越大,动画越慢,不是越快。字符串 'fast'
和 'slow'
分别代表200和600毫秒的延时。
使用标准效果列队,举个例子,我们可以设置800毫秒的延时在 <div id="foo">
的 .slideUp()
和 .fadeIn()
动画之间:
$('#foo').slideUp(300).delay(800).fadeIn(400);
当这句语句执行的时候,这个元素会以300毫秒的卷起动画,然后在400毫秒淡入动画前暂停800毫秒。
jQuery.delay() 用来在jQuery动画效果和类似队列中是最好的。但不是替代 JavaScript 原生的 setTimeout 函数,后者更适用于通常情况。
Example:
Animate the hiding and showing of two divs, delaying the first before showing it.
<!DOCTYPE html>
<html>
<head>
<style>
div { width: 60px; height: 60px; float: left; }
.first { background-color: #3f3; }
.second { background-color: #33f;}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<p><button>Run</button></p>
<div class="first"></div>
<div class="second"></div>
<script>
$("button").click(function() {
$("div.first").slideUp(300).delay(800).fadeIn(400);
$("div.second").slideUp(300).fadeIn(400);
});
</script>
</body>
</html>