Firefox 3.1のHTML 5対応--video/audio要素のサポート

杉山貴章(オングス)
2008-09-08 14:52:02
  • このエントリーをはてなブックマークに追加
最新特集【一覧】

HTML 5のマルチメディアサポート

 Firefox 3.1における新機能の目玉のひとつが、HTML 5で定義されているvideo要素およびaudio要素のサポートだろう。

 現状、ウェブページに埋め込まれた動画やオーディオの再生はプラグインを利用することで行っているため、HTMLファイルへの記述方法はコンテンツのフォーマットごとに異なっている。video/audio要素のサポートによって、任意のフォーマットのコンテンツを共通の方法で埋め込むことができるようになる。

 HTML 5のドラフトでは、特定のフォーマットとコーデックを優先するかどうかについて言及されていない。しかし、Firefoxで該当機能を担当しているChris Double氏は、7月31日に自身のブログで、FirefoxそのものにTheoraおよびVorbisのサポートが追加されたことを明らかにしている。

 これにより、Firefox 3.1では自身がデフォルトで持つ実装によってvideo要素によるTheora+Vorbisの演奏、およびaudio要素によるVorbisの演奏が行えるようになる。

 同機能はすでにFirefox 3.1のnightly buildにマージされている。今回はこれを利用してvideo要素による動画の再生を試してみたい。

video要素による動画の埋め込み

 まず、

リスト1 videoタグでTheora動画を埋め込む

    

 

リスト2 Wikimedia上の動画を再生




  
    
    videoタグの使用例
  

  

    

videoタグの使用例

図1 動画の上に再生ボタンが表示される 図1 動画の上に再生ボタンが表示される
図2 再生中は、動画上にマウスカーソルを合わせると停止ボタンが出る 図2 再生中は、動画上にマウスカーソルを合わせると停止ボタンが出る
ブラウザで表示を確認する

JavaScriptで再生/停止ボタンを実装する

  • 新着記事
  • 特集
  • ブログ