カルーセルの動画でカードを切り替えることはできません

Question

私はしばらくの間写真やビデオを表示できるメディアギャラリーを作成しています。これらはカルーセルに表示されます。

ここで問題となるのは、スイッチイベントがおそらくビデオ要素に適用され、カルーセルには適用されないため、カードが切り替わることができないビデオが含まれているカードに切り替えた場合です。

誰かがこの問題を解決したことがありましたか？

[UPDATE]

You can test it here

それはサファリ/ Mac上で正常に動作しますが、サファリ/ iOS搭載

に私はビデオコンポーネントだけにitemswipeイベントを追加しようとしていていません私は同じ問題を抱え、iOSで起動しません。

ビデオコンポーネントをスワイプすると、WebViewが垂直方向にスクロールしているようです。

Answer 1

ビデオオブジェクトにenableControls：falseプロパティを追加することで、ネイティブビデオコントロールを無効にする必要があります。しかし、独自のカスタムコントロールを実装する必要があります。

この問題は次のとおりです：https://stackoverflow.com/a/3488052/458679 "あなたのタッチイベントは、プレーヤーのデフォルトのコントロールによって吸収されています。ビデオ要素のコントロールをfalseに設定すると、ビデオ要素のイベントを完全に制御できます。非常に難しくない独自のカスタムコントロールを実装する必要があることを意味します。

また、私はビデオ上でz-indexを使ってオーバーレイのdivを配置しようとしました（私は以下のコードを貼り付けました）。しかし、それはIOS上で動作しませんでした。ネイティブビデオコントロールが有効な場合、プレーヤーは常にトップレイヤーに位置します。

行82を次のように変更します。

var panel2 = new Ext.Panel({items:[video],html: '<div class="overlay">first panel</div>'}); 

.X-ビデオ{位置：絶対;}これらのスタイルを追加します。あなたの答えのための

.overlay {width: 100%; 
height: 100%; 
background-color: gray; 
z-index: 111; 
position: absolute; 
opacity: 1;margin-top: -25px;}