MediaElement.jsとは

動画(音声)フォーマットのブラウザ対応を良い感じに吸収してくれるJavaScriptライブラリです。
このテストでは2.6.5を使用しています。

MediaElement.js - HTML5 video player and audio player with Flash and Silverlight shims

コード

object要素からの呼び出しはH.264形式を指定する。

<script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="mediaelement-and-player.min.js"></script>
<link rel="stylesheet" type="text/css" href="mediaelementplayer.css" />
<script>
$(function(){
    $('video').mediaelementplayer();
});
</script>
<video width="480" height="272" controls autobuffer>
    <source type="video/mp4" src="xxx.mp4">
    <source type="video/mp4" src="xxx.mp4">
    <source type="video/ogv" src="xxx.ogv">
    <source type="video/webm" src="xxx.webm">
    <source type="video/flv" src="xxx.flv">
    <object width="480" height="272" type="application/x-shockwave-flash" data="flashmediaelement.swf">
        <param name="movie" value="flashmediaelement.swf" />
        <param name="flashvars" value="controls=true&file=xxx.mp4" />
    </object>
</video>

480 x 272

640 x 360

960 x 540

1280 x 720

1920 x 1080