問題タブ [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.
jquery - Jquery メニュー - ハッシュ リンクを使用したカルーセルの制御
mmenu をセットアップしましたが、メニューのリスト項目内にある場合、すべてのハッシュ リンク (#one、#teo など) を無視するようです。
Mメニューからカルーセルを制御できるようにしたい。
それらをリスト項目の外に出すと機能しますが、mmenu のフォーマットが失われ、クリックしても mmenu が閉じなくなります!
デモを見る: http://demo.tyga.co.uk/easyjet/index.htm
カルーセル スライドを前方に移動するためにメニューのハッシュ URL を許可するオプションはありますか?
ありがとうアンディ
jquery - jquery cssのサイズ変更時のフクロウカルーセルレスポンシブクロップ幅
フクロウ カルーセルを使用して、メイン ページにギャラリー カルーセル/スライド ショーを作成しています。http://owlgraphic.com/owlcarousel/
ただし、レスポンシブで画像のサイズを変更するのではなく、幅を特定の最大「トリミング量」まで均等にトリミングする必要があります。ここまでのコードです。
カルーセル div #home-carousel をターゲットにしようとしましたが、すべてのラッパー、アイテム、img、どれも思いどおりに機能していないようです。ページの右側に常に画像が重なっているか、この白いブロックがあります (画像が左に移動しています) #home-carousel div の幅を 10,000 のように非常に大きくすることでうまくいきましたが、ページに水平スクロールバーが表示されるため、これは適切ではありません。
たぶん、これを行うためのはるかに簡単な方法がありますか?
編集: サイズを小さくしている間は、img を移動するのがこれまでのところ最もうまく機能しますが、サイズを大きくしている間は画像が重なっているのを見ることができます。これは、「リフレッシュ レート」またはサイズ変更イベントがトリガーされる頻度が原因である可能性があります。アイテムを手動で非表示にして、現在のアイテムのみを表示する必要があると考えています。他の解決策は大歓迎です。
css - 位置: HTML5 ビデオ タグの z-index バグを修正
Chrome に奇妙なバグがあり、固定ナビゲーション ドロップダウン メニューが、ホバーしたときに HTML5 ビデオ タグの上に正しく表示されません。Firefox を確認すると、まったく問題なく動作していますが、Chrome ではクリック可能であるにもかかわらず非表示になっているようです。ドロップダウンとビデオの両方で -webkit-backface-visibility から複数の可能なソリューションを試しました。また、古い Flash/YouTube 埋め込みソリューションで可能な wmode=transparent 属性も試しましたが、何も機能していません。
問題は次の場所で確認できます。
http://spencerfink.net/capers/
注: マイ ナビゲーションとドロップダウン メニューは、位置を固定する必要があります。ユーザーがどこをスクロールしても常にページの上部に表示されるように固定します。位置: 要素の絶対的または相対的な変更が私のニーズを満たしていません。
ドロップダウンを Chrome に表示させる唯一の方法は、ビデオを含む #banner div を -1 の z-index に変更することですが、それはページの下部にある [お問い合わせ] ロールアップ セクションなどに干渉しますz-index シャッフルは、ナビゲーションバーをページ上部の固定位置から切り離してしまいます。
この問題は Owl Carousel のあるページでも発生していますが、解決策は類似または同一だと思います。
紛争地域のHTML
関連CSS
私は答えを求めてウェブを精査してきました!
javascript - フクロウのカルーセルと Bootstrap 3 を使用して、画像を幅と高さの中央に配置します
ブートストラップとフクロウのカルーセルを組み合わせて、レスポンシブな画像ギャラリーのブラウジング エクスペリエンスを実現しようとしています。高さが固定された固定ヘッダーと、高さが固定された固定フッターがあります。
ここでの私の目標は、画像の高さに関係なく、スライダー内の画像が常にフッターのヘッダーの中央に配置されるようにすることです。これを達成するために、フッターとヘッダーの間にある種の動的コンテナを作成する簡単な方法や、画像のサイズを変更するための気の利いたJavaスクリプトを作成する簡単な方法はありますか? (ソリューションはモバイルでも機能する必要があることに注意してください)
これが私のjsfiddleの例です http://jsfiddle.net/Tenacity/GMu2x/
私の心はこれに似た何かを考えています
そして、xx は画面の高さと幅に基づいて動的に計算されると考えています
私の例を見ると、現在、margin-top css属性を使用して、すべての画像を上から約60px左から右にスクロールしていますが、これはもちろん上からより良い解決策で削除しますが、達成したいそれらが表示されるときは常にデッドセンターの画像。
前もって感謝します
javascript - javascript 変数を jQuery プラグインの初期化関数に渡す
jQuery プラグイン「Owl Carousel」を使用していますが、javascript 変数をオプション値としてプラグインを初期化しようとすると、奇妙な問題が発生します。
基本的に私は以下を持っています:
これは機能せず、itemCustom の値が reinit 関数に正しく渡されません。ただし、itemCustom の値を手動で入力すると、必要に応じて完全に機能します。2 つの画像の場合
これがなぜなのか、誰でも解決できますか?javascript デバッグを使用すると、thumbnail_breakpoints が確実に正しく設定されていることがわかります。また、switch case ステートメントを変更して、それぞれが必要な値で直接 jQuery 関数呼び出しを行うようにすると、正常に動作しますが、それはコードの大規模な複製です。
助けてくれてありがとう。
PSこれはprototypejs内にあるため、jQueryが非競合モードで呼び出される理由です。