0

私のウェブサイトの基本的なスライドショーを作成するために、この簡単なコードを書きました。このコードはしばらくは正常に動作しますが、その後、誤動作し始めます。つまり、画像が適切に読み込まれず、同じ画像が突然ポップアップしてフェードし、ゆっくりと再び表示されます。SetTimeOut のタイミングに何か問題がある可能性がありますが、何度も試してみましたが、問題は解決しませんでした。

    var x = 1;
    function F() {
        $('#Left').html("<img src='Images/" + x + ".jpg' />").fadeOut(0).fadeIn(1000).delay(5000).fadeOut(1000);
        if (x < 3) { x++;}
        else { x = 1; }
        setTimeout("F()", 7000);
    }

私の質問は、単純なコードの何が問題なのか、どうすれば修正または改善できるのかということです。

4

1 に答える 1

1

フェード操作に正確に 7 秒かからないという問題があると思いますが、タイムアウトが 7 秒にスケジュールされているため、時間の経過とともに 2 つが適切に並んでいません。完了機能で最後のフェードが終わったら次のアニメーションを開始することで、累積誤差なく完全に整列させることができます。

   var x = 1;
   function F() {
        $('#Left').html("<img src='Images/" + x + ".jpg' />")
            .fadeOut(0)
            .fadeIn(1000)
            .delay(5000)
            .fadeOut(1000, F);
        if (x < 3) { x++;}
        else { x = 1; }
    }
于 2013-09-07T17:53:28.850 に答える