“video”要素~“preload”属性

“preload”属性について

“preload”属性はページを読み込む際に音声コンテンツのファイルの読み込みを開始するべきかどうかのヒントをブラウザに与えます。これはブラウザに対して指定した動作を強制するものではないため、確実に指定した通りの動作になるとは限りません。

“preload”属性を指定していない場合の既定値はブラウザによって違います。また、“autoplay”属性を指定している場合は“preload”属性の指定にかかわらずページを読み込むときにデータの読み込みが開始されます。

指定できる値

サンプルコード

事前読み込みしない
<p>

<video preload="none" controls style=" max-width: 100%;">

<source src="sample.mp4" type="video/mp4">
<source src="sample.webm" type="video/webm">
<source src="sample.ogv" type="video/ogg">
動画ファイルを再生できません

</video>

</p>
メタデータのみ読み込む
<p>

<video preload="metadata" controls style=" max-width: 100%;">

<source src="sample.mp4" type="video/mp4">
<source src="sample.webm" type="video/webm">
<source src="sample.ogv" type="video/ogg">
動画ファイルを再生できません

</video>

</p>
事前読み込みしても良い
<p>

<video preload="auto" controls style=" max-width: 100%;">

<source src="sample.mp4" type="video/mp4">
<source src="sample.webm" type="video/webm">
<source src="sample.ogv" type="video/ogg">
動画ファイルを再生できません

</video>

</p>

事前読み込みしない

メタデータのみ読み込む

事前読み込みしても良い