0

私は現在、コーディングをより理解し、すべてがどのように組み合わされるかをよりよく理解できるように、テスト Web サイトを構築している最中です。

私の問題はこれです-私はサイトのセクションにいくつかの引用を持っています.それらはフェードインしてからスライドしてビューから外れ、新しい引用が明らかになります. これは私が間違いを犯したということです。すべての引用符を循環するように完全に設定しましたが、停止します。ぜひリピートしていただきたいです。私の間違いは、setInterval コードの代わりに .setTimeout 関数を使用していることです。

私の質問はこれです、コードを交換するための簡単な解決策はありますか?

これがあなたが見るためのコードです。どんな助けでも大歓迎です。

$(function(){
setTimeout(function()
    {
    $("#jobs_1").slideUp(800);
    }, 4000); 
});
$(function(){
setTimeout(function()
    {
    $("#jobs_2").fadeIn(400);
    }, 4800); 
}); 
$(function(){
setTimeout(function()
    {
    $("#jobs_2").slideUp(800);
    }, 8000); 
});
$(function(){
setTimeout(function()
    {
    $("#jobs_3").fadeIn(400);
    }, 8800); 
});     
$(function(){
setTimeout(function()
    {
    $("#jobs_3").slideUp(800);
    }, 12000); 
});
$(function(){
setTimeout(function()
    {
    $("#jobs_4").fadeIn(400);
    }, 12800); 
});
$(function(){
setTimeout(function()
    {
    $("#jobs_4").slideUp(800);
    }, 16000); 
});
$(function(){
setTimeout(function()
    {
    $("#jobs_1").fadeIn(400);
    }, 16800); 


});

どうもありがとう

4

2 に答える 2

0

これはあなたを助けるはずです。使い方？現在のジョブ カウンターを 0 に設定します。次に、setInterval を使用して、3 秒ごとにメイン関数を実行し、ジョブ カウンターをインクリメントします。カウンターが 4 (最後のジョブ) を超えた場合、ジョブ 4 を非表示にして、最初のジョブをフェードインします。それ以外の場合は、前のジョブをスライド アウトして、新しいジョブをフェード インします。

$(function(){
    count = 1;

    x = setInterval(function(){
        count++;
        if( count > 4) {
            $('jobs_4').hide(function(){
                $('#jobs_1').fadeIn();
            });

            count = 1
        } else {
            $('#jobs_' + (count-1)).slideUp(function(){
                $('#jobs_' + (count-1)).fadeIn();
            });
        }

    }, 3000);
}
于 2013-06-02T12:58:36.830 に答える
0

すべてのブロック名をスタックに移動して、1 つの関数を使用できます。

var blocks = ['jobs_1', 'jobs_2', 'jobs_3', 'jobs_4'];
var curentBlockIndex = 0;
setInterval(function(){
    var nextBlockIndex = curentBlockIndex + 1;
    if (nextBlockIndex >= blocks.length) nextBlockIndex = 0;
    $('#' + blocks[curentBlockIndex]).slideUp(800, function(){
        $('#' + blocks[nextBlockIndex]).fadeIn(400);
    });

    curentBlockIndex = nextBlockIndex;
}, 4000);
于 2013-06-02T13:07:50.300 に答える