fadeOut在setTimeout中的时序问题

Question

我的jQuery代码有问题。

在“开始”中，它显示具有混叠效果的文本，然后在11秒后淡出，并再次执行此操作。过了一段时间，我在洗牌效应一开始就得到了fadeOut效应。

他们似乎在不同的时间线上运行。

$( document ).ready( function(){

     function textShuffle() {
        $( "#text" ).shuffleLetters().fadeIn().delay( 11000 ).fadeOut( 400 );
        setTimeout( textShuffle, 12000 );
     }
     textShuffle();

});

我该怎么解决这个问题。

Answer 1

在删除了.shuffleLetters()脚本之后，@alexander就可以正常工作了，我意识到这个函数需要超过600 it的时间才能完成，而且我无法确定它需要多少时间来完成任务。

因此，现在我在调用setTimeout()之前向#text添加了诺言()

function textShuffle() {
    $( "#text" ).shuffleLetters().fadeIn().delay( 11000 ).fadeOut( 400 );
    $( "#text" ).promise().done( function(){
            setTimeout( textShuffle, 1 );
    });
 }

Answer 2

也许您应该在fadeOut完成之后调用递归方法，如下所示：

$( document ).ready( function() {

    function textShuffle() {
        $("#text").shuffleLetters().fadeIn().delay(11000).fadeOut(400, Function() {
            setTimeout(textShuffle, 12000);});
    }

    textShuffle();
});