なぜ動画がこのように埋め込まれるのか、その原因を探るのにかなりの時間を費やしました。
<video height="256" loop autoplay muted controls id="vid">
<source type="video/mp4" src="video_file.mp4"></source>
<source type="video/ogg" src="video_file.ogg"></source>
</video>
のように埋め込まれたビデオは、FireFoxではページが読み込まれると自動的に再生されますが、Webkitベースのブラウザでは自動再生ができません。この現象は、いくつかのランダムなページでのみ発生しました。これまでのところ、原因を見つけることができませんでした。閉じていないタグや、CMS編集者が作成した広範なJSが原因ではないかと考えています。
私が得た最良の修正方法は、</video>
のすぐ後にこのコードを追加することでした。
<script>
document.getElementById('vid').play();
</script>
...美しくはありませんが、なんとかなりました。
**更新しました。
最近、多くのブラウザは音を消した状態でしか動画を自動再生できないので、videoタグにmuted
属性を追加する必要があります。
<video autoplay muted>
...
</video>
私はちょうど今、私のビデオで同じ問題を取得しました。
<video preload="none" autoplay="autoplay" loop="loop">
<source src="Home_Teaser.mp4" type="video/mp4">
<source src="Home_Teaser" type="video/webm">
<source src="Home_Teaser.ogv" type="video/ogg">
</video>
検索の結果、解決策を見つけました。
preload"属性を"true"に設定すると、動画は正常に開始されます。