Question

我想要实现的目标很简单。我见过插件这样做，但我不想使用插件。

我有两个锚点图像。 #fade1我要加载，然后显示3秒然后淡出。然后#fade2我想在#fade1之后淡入并显示3s然后在重复该过程时淡出。

然而，当我将#fade2设置为900时，它会以450ms的速度淡入其他fadeOut。那么有人可以帮我解决这个问题，并解释为什么我刚才提到的不起作用吗？

这是我的代码。

$('a#fade1, a#fade2').hide();

$('div#fadetransitions').ready(function() {
    $('a#fade1').fadeIn(450).delay(3000).fadeOut(450);
    $('a#fade2').delay(3450).fadeIn(900).delay(3000).fadeOut(450);
    return false;
});

Answer 1

你可以这样做：

$('a#fade1, a#fade2').hide();

function show1() {
    $('a#fade1').fadeIn(450).delay(3000).fadeOut(450, function(){show2();});
}

function show2() {
    $('a#fade2').fadeIn(450).delay(3000).fadeOut(450, function(){show1();});
}


$().ready(function() {
    show1();
});

JQuery Cross Fade Transition Onload

1 个答案: