問題タブ [infinite-carousel]

各日の下に項目がある 7 日間を含むカルーセルを作成しようとしています。次のボタンが押されると、jquery は form の最後の span 要素を探し<span class="date">DATE</span>、値を取得してサーバーに渡し、次の 3 つのエントリを取得します。これらのエントリは、<ul class="week">要素と 7 日間全体が右に 3 ずつスライドします。私の最初の問題は、最初のクリック後にjqueryが動的に生成されたコンテンツを表示していないようで、最初の日付値をサーバーに送信するだけで、これらの3つの日付が何度も繰り返されることです。2番目の問題は、十分な時間クリックした後、新しいコンテンツの生成を停止し、最後にコンテンツを追加できないことです.当時のサーバーはまだhtmlを吐き出します..私はこれの初心者であり、ベストプラクティスを持っていない可能性がありますわかった。これが私の関連コードです：

最初の問題は解決しました。サーバーから返されたデータには、日付の前後にスパン要素が含まれていませんでした。@RoccoC5 のおかげで、日付が正しく増加するようになりました。

2011 年 8 月 15 日に開始したときに、この場合は 2011 年 10 月 26 日に十分に高くなると、ランダムにエントリが不足してしまいます。

log_entries/ajaxdate/2011-09-12 がロードされたときにサーバーから返されるコードは次のとおりです。

jQuery 無限カルーセルは機能しますが、不安定です。クリックして「右にスクロール」すると、前方にジャンプしてから、開始位置にリセットされます。その後、クリックするたびに正常に機能し、その後すぐにスクロールします。「左スクロール矢印」をクリックするとスムーズに移動しますが、「無限」の側面は壊れています。スクロールすると、空白が残り、空白が適切な画像に置き換えられます。これはすべてのブラウザで発生します。

質問:マージンまたはカルーセル コンテナーの幅が間違っていると、このように動作しますか? そうでない場合、何が原因ですか？

HTML

JS

CSS

javascriptnoobからの別のVimeo関連の問題...

ここで問題を設定しました：http：//jsfiddle.net/ajtTF/

リンクをクリックすると、Jqueryの無限カルーセルギャラリーを備えたインラインFancyboxモーダルが読み込まれます。ギャラリーは現在、2つの埋め込まれたVimeoビデオで構成されています。

モーダルが閉じられてから再開されるまで、すべて問題ありません。モーダルは、何らかの理由で、2番目のビデオを最初のビデオに置き換えます（つまり、同じビデオの2つのインスタンスを表示し、他のビデオは無視します）。

私は最終的にこの状況でいくつかのビデオが欲しいでしょう。追加のjsを適用する場合、これが考慮に値するものであるかどうかはわかりません。

事前に感謝します。私のjsスキルはかなり存在しないことを強調する必要がありますので、明確にしてください。私の例を自由にいじってください。

問題の例: http://jsfiddle.net/EtWXX/

無限カルーセルを自動再生に設定しています。動画も埋め込まれています。ただし、2つのことを行う必要があります。

1. ビデオが再生されている場合は停止します。
2. 「next」と「prev」が相互作用した場合は停止します。

私はこのjQueryInfiniteCarouselを使用していますが、デモとは少し異なる方法で、「CustomerSuccessStories」という見出しの下に私の使用法を見ることができます。

ご覧のとおり、カルーセルを中央に配置し、カルーセルをスクロールしても前の画像が表示されるようにしました。カルーセルが最初に読み込まれるとき、シーケンスの最後の画像は読み込まれないため、最初の画像の左側に空白があります。カルーセルが最初の画像に戻ると、最後の画像も一時的に消えます。

私はこれを何度も自分で修正しようとしましたが、jQueryの知識が不足していて、スクリプトが応答を停止します。カルーセルがロードされたときに表示され、最初に到達したときに消えないように、シーケンスの最後の画像を取得する方法を知っていますか？また？ありがとう。

jQueryスクリプトは次のとおりです。

ここに簡単なフィドルを設定しました。私が望むのは、左または右に無限にスクロールし (カルーセル スタイル)、要素を繰り返すだけです (つまり、右端から「落ちて」左に再表示され、その逆も同様です)。スクロールのどこにいるのかをキャプチャできますが、その後の最善の方法はわかりません。要素を動的に移動しようとするルートをたどる前に、非常に単純なトリックがあるように思えます。

CSS

HTML

JS

jQuery.animate()を使用して無限カルーセルを作成しています。.animate()以前は問題なく使用していました。ただし、今回はアニメーションが完成していません。

これは非常に単純なアニメーションでmargin-left、別の値に変化します。値が変化し、私にはそれが完了したように見えますが、関数は起動しません。

これが私のコードです：

問題の領域は、ページの下部にあるカルーセルです。を使い果たしていますjquery-1.7.1.min.js。

私の主な質問は、イベントが完了したように見えても、何がこの関数の起動を妨げているのでしょうか?

私は無限のjQueryカルーセルを構築しています。最後のスライドがユーザーに表示された直後に最初のスライドが表示されることは無限です。これを実現するために、postcompleteコールバック関数でこの小さな調整を行います

$('#slide li:last').after('#slide li:first')。

これは基本的に無限のスライドショーを実現させるものです。ただし、特に2番目のスライドを台無しにします。スライド1からスライド2に移動する最初の反復で、スライド2はスライド3に置き換えられます（そしてそれは非常に迅速に行われます）。以降のすべての反復は、スライド2がスライド3ではなくスライド2としてレンダリングされる場合に正常に機能します。

この例をさらに理解するには、必要なすべてのHTML、CSS、jQueryをキャプチャする次のjsフィドルを見てください。

jQueryの無限カルーセル/スライドショーのjsfiddle

誰もが何が起こっているのか知っています:)？

だから、私は無限のjQueryカルーセルを構築しようとしていますが、ある方向ではかなりうまく機能していますが、別の方向では機能していません。まあそれは別のもので働いていますが、ある種のことだけです。

無限の操作を実現するために、これが私が行うことです。

ご覧のとおり、これはわずかなdom操作であり、「前方」では完全に機能しますが、「後方」ではグリッチが発生します。あなたはここでそれをチェックすることができます@JSFIDDLE

私はこれに対抗するためにいくつかのトリックを行いましたが、どれも機能していません。誰もが何が起こっているのか知っていますか？

このスクリプトを使用して、私の Web サイトで無限のカルーセルを作成しました。CSSでカスタマイズされているので、最初と最後のアイテムが途中まで表示されます。

右矢印をクリックし続けると、最後に空のスペースにぶつかってしまいます。これまでのところ、これを修正できませんでした。誰でも解決策を提供できますか?

関連するスクリプトは次のとおりです。