ドキュメントには多数の div があり、一度に表示できるのはそのうちの 1 つだけです (他は display:none です)。
表示されていた div が非表示になり、再び表示されると、div 内のビデオは再生されなくなります。
ただし、これは iPad のみの問題です。
それらを再初期化する方法に関する提案はありますか?
ありがとう
デレク
ドキュメントには多数の div があり、一度に表示できるのはそのうちの 1 つだけです (他は display:none です)。
表示されていた div が非表示になり、再び表示されると、div 内のビデオは再生されなくなります。
ただし、これは iPad のみの問題です。
それらを再初期化する方法に関する提案はありますか?
ありがとう
デレク
解決策をあらゆる方法で検索した結果、video.js が初期化された後に非表示になっているコンテナー内の video.js を使用するビデオは、再び表示されると再生できなくなるようです。
そのため、今のところ、ブラウザが iPad/iPhone 上にあることをページが検出すると、ネイティブ ビデオ プレーヤーが使用されます。
これを行うには、ページの先頭にある javascript ブロック内に video.js のインクルードを配置して、iPad または iPhone が検出された場合に読み込まれないようにします。
<script type="text/javascript">
if(!navigator.userAgent.match(/iPad/i) && !navigator.userAgent.match(/iPhone/i)) {
document.write('<link href=\"\/\/vjs.zencdn.net/c/video-js.css\" rel=\"stylesheet\" type=\"text/css\" \/\>');
document.write('<script src=\"\/\/vjs.zencdn.net/c/video.js\" type=\"text/javascript\"\>\<\/script\>');
}
</script>
Firefoxでこの問題が発生しましたが、コンテナdivを非表示のdivに移動した後にビデオを停止しようとしたためです。「停止」コードを削除しました。クロム、Firefox、およびオペラで、ある div から別の div に移動した後、プレーヤーは再初期化されたように見えますか?(そして自動的に停止します)。
この単純な解決策の前に、javascript を介してビデオの元の html を再追加することを考えました。おそらく、div が非表示になった後、または表示される前に実行できます。