2

html5 ビデオ タグを使用しようとしています。Safari と Firefox では問題なく動作しますが、Chrome では画面が点滅して空白になります。しかし、ブラウザ ウィンドウのサイズを変更すると、ビデオが再び表示されます。コードをテストページに配置し、以下にも含めました。

http://www.bilalallawala.com/test.html

どんな助けでもいただければ幸いです

<video poster="https://s3.amazonaws.com/bilalallawala/resources/video/cover.jpg" preload="auto" autoplay="true" style="background-size:cover;width:100%;height:auto;position:fixed;left:0;">

    <source src="https://s3.amazonaws.com/bilalallawala/resources/video/tl16x9.ogg" type="video/ogg">
    <source src="https://s3.amazonaws.com/bilalallawala/resources/video/tl16x9.mp4" type="video/mp4">

</video>
4

1 に答える 1

1

いくつかの簡単なテストを行ったところ、poster属性を削除すると問題が解決するようです。ブラウザは最初のビデオ フレームが利用可能になるとすぐに表示し、最初のフレームは使用していたポスターと同じであるため、これでもうまくいくはずです。

しかし、なぜこれが起こったのか分かりません。

その他の注意事項:

  • autoplayはブール属性であるためautoplay、単独であるか、そうでautoplay="autoplay"ないかのいずれかである必要がありますautoplay="true"
  • これらのビデオは、ユーザーにダウンロードさせるには非常に大きなファイルです。それらを縮小することを検討することをお勧めします。
于 2013-03-14T02:37:29.610 に答える