MP4（H.264）の動画でクロスブラウザ

nandani

13年前

この記事は公開から１年以上経過しており、内容が古くなっている可能性があります。

メモ

MP4（H.264）動画をHTMLに埋め込む場合、下記のようにvideoタグで埋め込むことになるかと思います。

<video src=”video.mp4″ width=”320″ height=”200″ controls preload></video>

が、ブラウザによってはH.264をサポートしていなかったり（Firefox）、そもそもvideoタグが利用できなかったり（IE8）で、結局はそれぞれのブラウザ用の動画を用意したり、タグを振り分ける必要がありました。

しかし、それを一気に解決する方法がこちらのサイトに書かれておりました。

やり方はとにかく簡単！

スクリプトをダウンロード＆解凍。
apiフォルダのみサーバに丸ごとアップロード。
head内に<script src=”（apiフォルダのアップロード先）/html5media.min.js”></script>を記述。
普通にvideoタグを書く。<video src=”video.mp4″ width=”320″ height=”200″ controls preload></video>

これだけ。

これでIE8、Firefoxでも再生可能となりました。

もともと再生可能なブラウザもありますが、以下のブラウザで再生が確認されました。