jQuery delay()

jQuery delay()方法用于延迟队列中函数的执行。这是在排队的jQuery效果之间进行延迟的最佳方法。 jQUery delay()方法设置一个计时器来延迟队列中下一项的执行。
句法:

$(selector).delay (speed, queueName)

速度:这是一个可选参数。它指定延迟的速度。其可能的值是慢, 快和毫秒。
【jQuery delay()】queueName:这也是一个可选参数。它指定队列的名称。其默认值为标准队列效果“ fx”。
让我们来看一个延迟效果的例子:
< !DOCTYPE html> < html> < head> < script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> < /script> < script> $(document).ready(function(){ $("button").click(function(){ $("#div1").delay("slow").fadeIn(); }); }); < /script> < /head> < body> < button> Click me< /button> < br> < div id="div1" style="width:90px; height:90px; display:none; background-color:black; "> < /div> < br> < /body> < /html>

立即测试
输出:
点击我
具有不同值的jQuery delay()示例让我们看一个jQuery delay()效果示例, 其中我们使用快速, 慢速和毫秒值。
< !DOCTYPE html> < html> < head> < script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> < /script> < script> $(document).ready(function(){ $("button").click(function(){ $("#div1").delay("fast").fadeIn(); $("#div2").delay("slow").fadeIn(); $("#div3").delay(1000).fadeIn(); $("#div4").delay(2000).fadeIn(); $("#div5").delay(4000).fadeIn(); }); }); < /script> < /head> < body> < p> This example sets different speed values for the delay() method.< /p> < button> Click to fade in boxes with a different delay time< /button> < br> < br> < div id="div1" style="width:90px; height:90px; display:none; background-color:black; "> < /div> < br> < div id="div2" style="width:90px; height:90px; display:none; background-color:green; "> < /div> < br> < div id="div3" style="width:90px; height:90px; display:none; background-color:blue; "> < /div> < br> < div id="div4" style="width:90px; height:90px; display:none; background-color:red; "> < /div> < br> < div id="div5" style="width:90px; height:90px; display:none; background-color:purple; "> < /div> < br> < /body> < /html>

立即测试
输出:
本示例为delay()方法设置了不同的速度值。
单击以淡入带有不同延迟时间的框

    推荐阅读