JSFiddleはここにあります...
わかった。幅の異なる画像を表示する JQuery カルーセルを作成しようとしています。これを実現するために、画像を含む順序付けられていないリストの右側に、シームレスで終わりのないスライドを作成しようとしています。閾値を超えた画像は.beforeプロパティで後ろに置き、永遠に続くようにする予定です。しかし、私には3つの問題があります。
最初の問題は、私のJSがこのように見える場合...
$(document).ready(function() {
function gallery () {
$("#image").animate({"margin-left":"200px"}, 3000);
}
setInterval(gallery, 3000);
});
3 秒間待機し、1 回だけ実行されます。一度だけ実行される問題を修正できるかどうかを確認するために周りを見回したところ、これが見つかりました...
そして、それを好む他の多くの質問。いつもそれは同じことです。彼らはこのように関数を呼び出しています...
setInterval(gallery(), 3000);
このような代わりに、setIntervalで...
setInterval(gallery, 3000);
だから、私はそれが解決策ではないことを知っています。私の関数にはすでに括弧がなく、正しい方法で呼び出されていることを考慮してください。（おもう。）
したがって、論理的には、次の問題である 3 秒の遅延を修正しようとしました。私はこれを書きました...
$(document).ready(function() {
$("#image").animate({"margin-left":"200px"}, 3000);
function gallery () {
$("#image").animate({"margin-left":"200px"}, 3000);
}
setInterval(gallery, 3000);
});
ページが読み込まれるとすぐに実行されるようになりましたが、以前は setInterval が 1 回しか実行されていなかったため、2 回発生すると仮定します...
$("#image").animate({"margin-left":"200px"}, 3000);
1 つはロード時に実行され、もう 1 つは setInterval によって「ギャラリー」関数から実行されました。しかし、そうではありません。すぐに実行されますが、発生するのは 1 回だけです。
私の最後の問題は setInterval とは何の関係もありませんが、一石二鳥だと思います。私の順序付けられていないリストの幅は 9,999 ピクセルなので、アニメーションを連続して実行しても、最終的に移動する要素がなくなるということですか?
ありがとうございます！