Question

我有一个小脚本必须显示下一个图像，所以我写了类似的东西

$(".img1").delay(2500).fadeIn(600);
$(".img2").delay(6200).fadeIn(600);
$(".img3").delay(8700).fadeIn(600);
$(".img4").delay(11200).fadeIn(600);
$(".img5").delay(13700).fadeIn(600);
$(".img6").delay(16200).fadeIn(600);

现在我想知道，如何在最后一张图片后运行功能？我不想使用setTimeout。

Answer 1

fadeIn采用第二个参数“回调” - 请参阅文档：http://api.jquery.com/fadein/

它可以是任何函数，并在动画完成时调用。

在那里传递一个匿名函数。

$(".img6").delay(16200).fadeIn(600, function(){
    alert("It's over, it's done!");
});

Answer 2

fadeIn有一个'完整'回调作为第二个参数。 http://api.jquery.com/fadein/

$(".img1").delay(2500).fadeIn(600);
$(".img2").delay(6200).fadeIn(600);
$(".img3").delay(8700).fadeIn(600);
$(".img4").delay(11200).fadeIn(600);
$(".img5").delay(13700).fadeIn(600);
$(".img6").delay(16200).fadeIn(600, function(){
    alert('Hello world!');
});

Answer 3

fadeIn()允许您在函数本身完成其工作后运行回调函数，请参阅此处的文档：http://api.jquery.com/fadein/

<强> JS

$("#test").fadeIn(1000, function(){
    //--- do whatever you need once the fade in is completed
})

<强> FIDDLE

http://jsfiddle.net/TFtt3/

Answer 4

你可以看看这个jQuery插件：

http://jquery.offput.ca/timers/

oneTime()方法允许您在特定秒数后运行代码ONCE。

$('#myelement').oneTime('10s', function() {
    // do something after 10s
});

但实际上插件的底层代码使用setTimeout / setInterval。

Answer 5

在fadeIn之后使用另一个延迟，然后队列传递你的函数

$(".img6").delay(16200).fadeIn(600).delay(100).queue(function(){ alert("");});

如何在10秒后不使用setTimeout运行函数

5 个答案: