IE6,7,8でもHTML5で動画再生 【video.js編】
以前紹介したhtml5mediaも再生だけなら十分ですが、video.jsは動画再生周りのイベント処理が充実しています。
VIdeo JS
video.jsも他のライブラリと同様に、videoタグに対応していないブラウザでは付属のswf経由で動画ファイルを再生します。
設置も簡単。まずはお約束のjsとcssの読み込み
videoタグでムービーを設置（コントローラ付き自動再生、自動読み込みの場合）
オプションについてはこちら
H264 mp4に対応していないFirefoxなどではswf経由でmp4を再生するので、PCサイトではwebmやogv形式の動画ファイルは特に必要ないかと思われます。
大して手間ではないので、webmやogvを用意しておいたほうが無難ではありますが。
webmやogvのコンバーターはこちら。フリーで使いやすい（Mac版のみ）
http://www.mirovideoconverter.com
VIdeo JS
video.jsも他のライブラリと同様に、videoタグに対応していないブラウザでは付属のswf経由で動画ファイルを再生します。
設置も簡単。まずはお約束のjsとcssの読み込み
<link href="path/to/video-js.css" rel="stylesheet">
<script src="path/to/video.js"></script>
<script>
//swfファイルを別のディレクトリに置く場合
_V_.options.flash.swf = "path/to/video-js.swf"
</script> |
videoタグでムービーを設置（コントローラ付き自動再生、自動読み込みの場合）
<video class="video-js vjs-default-skin" width="640" height="320" poster="path/to/image.jpg" id="samplemovie" autoplay controls preload="auto" > <source src="path/to/sample.mp4" type='video/mp4' /> <source src="path/to/sample.webm" type='video/webm'/> <source src="path/to/sample.ogv" type='video/ogg' /> </video> |
H264 mp4に対応していないFirefoxなどではswf経由でmp4を再生するので、PCサイトではwebmやogv形式の動画ファイルは特に必要ないかと思われます。
大して手間ではないので、webmやogvを用意しておいたほうが無難ではありますが。
webmやogvのコンバーターはこちら。フリーで使いやすい（Mac版のみ）
http://www.mirovideoconverter.com
1 Comment
4月 th, 2014 8:56 PM