【HTML5】動画再生のブラウザ対応
videoで指定した動画ファイルが、ブラウザによっては未対応の場合もあるので、その為の対応をご紹介します。
様々なブラウザ対応の為、source要素を使って複数の圧縮形式の動画ファイルを指定します。
【使用例】
<video width="300" height="150" controls="controls"> <source src="sample.ogv" type='video/ogg; codecs="theora,vorbis"'> <source src="sample.mp4" type='video/mp4; codecs="avc1.42E01E,mp4a.40.2"'> </video>
複数の圧縮形式の動画ファイルをsource要素で指定することで様々なブラウザに対応対応させます。
動画ファイルの圧縮形式によってtype属性、codecs属性をそれぞれ指定します。
【source要素の属性】
src → 動画ファイルを指定
type → ファイルのMINEタイプを指定
media → ファイルの対象としているメディアを指定
【type属性の設定例】
type=’video/mp4; codecs=”avc1.42E01E,mp4a.40.2″‘
→ MP4コンテナ:シンプルベースライン H.264動画とAAC音声
type=’video/mp4; codecs=”mp4v.20.8,mp4a.40.2″‘
→ MP4コンテナ:MPEG-4 シンプルプロファイルレベル0動画とAAC音声
type=’video/ogg; codecs=”vorbis”‘
→ OGGコンテナ:vorbis 音声コーデック
コメントを残す