実は使ったことがなかったので、使い方を簡単にまとめ。
動画を再生する際に使用する、<video>タグです。
Flashなどのプラグイン導入が不要で、手軽に動画を扱うことができます。
実装はとても簡単で、下記のように指定するだけ。
<video src="[動画ファイルのパス]"></video>
ほどんど <img>タグの感覚で使えます。
また、下記のような指定をすることで、その再生できるファイルの候補をいくつか指定することもできます。
<video> <source src="[動画ファイル1.mp4]"> <source src="[動画ファイル2.ogv]"> </video>
上記のように <source>タグを使い、複数の動画ファイルを指定できます。
ブラウザは、上から順に再生可能な動画データを再生するので、仮に mp4が再生できなくても、その次の orv を再生してくれます。
また、この<video>タグにはいくつかの属性があります。
まず autoplay属性で、こちらはその名のとおり、自動で動画を再生してくれます。
次に、preload属性で、ウェブページを読み込んだ時点で動画を裏側で読み込みをしてくれます。
こちらはデフォルト値は auto で、一般的なブラウザでは、特に明記しなくてもあらかじめ読み込みをしてくれます。
もし、事前読み込みを禁止したい場合は preload="none" を指定します。
controls属性を指定すると、再生・一時停止・再生位置の移動・ボリューム などのメニューを表示するようにしてくれます。
最後に poster属性で、これは指定した動画ファイルが再生できなかった時に表示する画像を指定できます。
これは、<img>タグのalt属性のようなイメージですね。
以上、HTMLで動画の再生をする時に使える <video>タグのご紹介でした。
Youtubeの埋め込みの印象が強く、動画の再生＝ifremeというイメージがあったのですが、こんな簡単に実装できたのですね。
