問題タブ [owl-carousel]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
0 に答える
160 参照

javascript - JS を使用してサーバーからデータを自動的に要求する

jquery に owl-carousel プラグインを使用しています。データは、JSON を返す django ビューから取得されます。

これで問題なく動作しますが、サーバーに新しいデータを要求し続けるように変更するにはどうすればよいでしょうか? 送信している JSON は時間の経過とともに変化し、owl-carousel API にサーバーに要求し続けるように指示する方法がわかりません。

owlCarousel() 呼び出しを setInterval() 関数に入れようとしましたが、それでも JSON は 1 回しか取得せず、最初の JSON 応答のみを使用します...

これはどのように解決できますか?前もって感謝します

0 投票する
1 に答える
1710 参照

javascript - 私の写真スライダー、「フクロウ カルーセル」は、写真を互いの下に配置しますか?

「 owl-carousel 」の2 つの写真スライダーを使用して、サイトに取り組んでいます。

最初のスライダーは完全に機能しますが、2 番目のスライダーはすべての写真を互いに下に配置します。

jqueryの問題ですか、それともhtmlの問題ですか?

0 投票する
1 に答える
3089 参照

javascript - 2 番目のフクロウ カルーセル スライダーが読み込まれない

owl-carousel の 2 つのフォト スライダーがあるサイトで忙しいです。

最初のものは正常に動作しますが、2 番目のものは 1 つの画像のみを表示し、ボタンは表示されず、非常に大きなコンテナーが表示されます。これは初めてなので、どんな助けも素晴らしいでしょう。

0 投票する
2 に答える
5322 参照

jquery - 2 番目のフクロウ カルーセルの写真スライダーが機能しない

私はしばらくこれで忙しかったので、ここで複数の質問をしました。
しかし、ここにコード全体があります。動作しない 2 番目のカルーセルについてです。最初のカルーセルはうまく動作します。

ありがとう。

http://pastebin.com/wtPgi4cV

0 投票する
1 に答える
677 参照

jquery - 最後のスライドがマウスオーバーされたときにフクロウのスライダーがページ外にスクロールする

なぜこれが起こっているのかを理解するのに苦労しています。私はフクロウのグラフィックスライドを使用しています.マウスが最後のスライド要素の上に置かれると、ページはページから右にスクロールしたい!?!! ある時点で、フクロウのtranslate3d cssによって作成されたパディングの問題に絞り込んだと思っていましたが、それを再び見つけることができませんでした. css のパディングの問題を確認するためにコンテナーを縮小しようとしましたが、それでも同じ問題が発生します。他の jquery を停止し、コンソールに問題がないかどうかを確認しても、まだ頭を悩ませています。プレビュー用にウェブサイトを開いたので、何が起こっているのかをすべて見ることができます。http://cypion.com/template.php。スライダーを使用して最後のスライドに移動し、マウスでタッチします。何か案は?

EDIT Chrome がこの問題を抱えている唯一のブラウザのようです。

0 投票する
1 に答える
5301 参照

jquery - OwlCarousel を使用した AngularJS ng-repeat

私がやろうとしているのは、ng-repeat ディレクティブを使用して角度を付けてカルーセルの構造を構築し、それをフクロウのカルーセル jquery プラグインにフィードすることです。トリックの一部は、このカルーセルがビュー (ngView) で入ってくることです。

残念ながら、これはそれほど単純ではないようです。

これまでに検討したオプションは次のとおりです。

  1. $viewContentLoadedイベント。これは機能せず、明らかに嫌われています (コントローラーからの DOM 操作に相当するため)。
  2. カルーセル プラグインを初期化するために、ビュー ページの下部にいくつかのスクリプトを含めるだけです。これは静的コンテンツでは機能しますが、ng-repeat を介して追加されたコンテンツでは機能しません
  3. カスタム ディレクティブの追加。わかりました、これは機能しますが、それは自分でフリップペン全体のカルーセルを構築する必要があることを意味しているようです. jQuery.append() などの便利な使い方。このコードは以下のとおりです。

基本的に私の質問はこれです:これを行うための他の/より良い方法はありますか(無限ループとHTML文字列連結とは対照的に)?

構築する必要がある実際のカルーセル アイテムは、以下のサンプルよりもはるかに複雑であることに注意してください。

さて、いくつかのコード:

まず、関連するビューからの HTML スニペット:

次に、ディレクティブ構成:

編集

わかりました、その間に私は$templateCacheサービスを発見しました。

本質的に、スクリプトタグでテンプレートを定義します(私のものは実際には関連するビューにあります):

これは、次のようにディレクティブで取得できます。

魔法の最後のビットとして、オークフィッシュの提案を使用して$timeout

0 投票する
0 に答える
1969 参照

jquery - Owl Carousel: Chrome でのみ機能するシンプルなスライダー。Safari や Firefox では動作しません

実際の問題へのリンクは次のとおりです: http://ichael.net/files/slider-issue.html

Chrome にロードすると、正常に動作します。ただし、Safari または Firefox では、2 番目と 3 番目のスライドは表示されません。理由について何か助けはありますか?

次/前のリンクが見づらくて申し訳ありませんが、どちらの側にもあります。