2

http://sandbox.worldwatchlist.usを作成したWebサイト用に単純な回転バナーを作成しました。

ブラウザの別のタブに移動し、数秒後に戻ってくるまで、すべてが正常に機能していました...バナーは0.5秒以下ごとに回転していました。

特にsetTimeoutjavascriptで使用し、10秒(10000ミリ秒)に設定したため、なぜこれが発生するのかわかりません。

以下は、サーバー上のbanner.jsファイル内のすべてのコードです。この問題を解決するものを指摘してください。上記のウェブサイトをご覧になるか、http://www.youtube.com/watch?v=HWb2uc6KpFMで撮ったビデオのスクリーンショットをご覧ください。すべてのブラウザには、私がテストしたこの問題があります。

「jqueryバナーの回転が速すぎる」という答えを探しましたが、「setTimeoutを使用する」以外に問題を解決するための答えはありませんでした。

var banner_width = 960;
var default_pos = 0;
var current_pos = 0;
var next_pos;
var speed = 500;
var banner_tot; //number of banners
var current_num = 1; //current banner number

    $(function(){

        banner_tot = $(".banner_item").length;
        $(".banner_slider").css({width:(banner_tot*banner_width)});

        setTimeout( "slide()", 10000 );
    });


    function slide(){
        if(current_num==(banner_tot)){
            next_pos= 0;
            $(".banner_slider").animate({left: next_pos}, speed);
            current_num=1;

            setTimeout( "slide()", 10000 );
        }
        else{
            next_pos= current_num*(-banner_width);
            $(".banner_slider").animate({left: next_pos}, speed);
            current_num++;

            setTimeout( "slide()", 10000 );
        }
    }
4

1 に答える 1

5

あなたが目撃しているのはアニメーションの蓄積です。ブラウザで別のタブに切り替えると、アニメーションがキューに入れられ、元のタブに戻ると、すべてのアニメーションが順番に再生されます。

詳細については、http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup を参照してください。

于 2012-02-09T20:22:56.420 に答える