3

jQueryで、株式相場表示のように常にスクロールするカルーセルを作成しようとしています(つまり、スクロールアニメーションが一時停止することはありません)。

私がこれまでに試みたことのjsFiddleの例をここで参照してください:http://jsfiddle.net/c5VQe/

次のコードを使用して、3行のコードでカルーセルを作成しました。これは、カルーセルが1回回転した後、わずかな遅延があることを除いて、私が望むことを正確に実行します。

function RotateCarousel() {  
    $("ul li:first-child").animate({ marginLeft: -200  }, 1500, function () {
        $("ul li:first-child").appendTo('ul');
        $("ul li:last-child").css('margin-Left', 0);
        RotateCarousel();
    });
}

どうすればこの遅延を取り除くことができますか?

注:プラグインの使用には興味がありません。多くの不要なコードに頼ることなく、遅延をなくすことができるはずです。

4

1 に答える 1

2

easingオプションを次のように設定するだけlinearです:

$("ul li:first-child").animate({ marginLeft: -200 }, 1500, 'linear', function () {
//                                                         ^-- here

フィドル

これまでに設定したことがないため、jQueryではデフォルトで。に設定されていswingます。

.animate()ドキュメントから:

緩和

の残りのパラメータ.animate()は、使用するイージング関数を指定する文字列です。イージング関数は、アニメーション内のさまざまなポイントでアニメーションが進行する速度を指定します。jQueryライブラリの唯一のイージング実装は、と呼ばれるデフォルトとswing、と呼ばれる一定のペースで進行する 実装ですlinear


補足:あなたsetTimeout()の構文は間違っていました。

setTimeout(RotateCarousel, 1500); //passing a function object reference

カルーセルの初期化を遅らせるため。

于 2012-10-21T03:47:32.840 に答える