[解決済み] .animateをループさせる方法 JQuery
2022-02-16 14:52:04
質問
私は内部に画像を持つ単一のdivで作業しています。ページの右から左にスクロールして、右にカムバックして、ループで続けるアニメーションが必要です。私はここで多くの投稿に目を通しましたが、スクリプトが正しく動作するようにすることはできません。
'$(document).ready(function(){
function loop() {
$('#clouds').animate({left: '+=1400',},50000, 'linear', function(){
loop();
});
HTML
< div id="clouds">< img border="0" alt="animated clouds" src="/images/clouds.png" />< /div>
CSS
#clouds {
position:absolute;
z-index:500;
right:0px;
top:10px;
}
解決方法は?
これを試してみてください。
JSFiddle http://jsfiddle.net/2YqH2/
雲を右側に戻していませんね。ループ関数の中に
$('#clouds').css({right:0});
で、そこからループが続きます。また、雲を右から左に移動させたいということだったので、アニメーションを "right" プロパティをアニメーション化するように変更しました。
また、あなたのjavascriptは整形式ではありませんでした。中括弧と括弧をきちんと閉じてください。修正したjavascriptはこちらです。
$(document).ready(function() {
function loop() {
$('#clouds').css({right:0});
$('#clouds').animate ({
right: '+=1400',
}, 5000, 'linear', function() {
loop();
});
}
loop();
});
関連
-
[解決済み] Vimeoのコントロールを非表示にする方法
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] jQueryの「exists」関数はありますか?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryでテーブルの行を追加する
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン