HTML5 <video> support for older browsers

I’ve been working on a small project to bring support for the HTML5 <video> tag to older browsers, hoping to encourage use of this tag.  The idea is to use Flash’s video/mp4 support as a “downlevel” emulator for the video tag.

It uses an HTC binding in IE and an XBL binding in Mozilla to create a flash video in place of the video tag itself. The flash video support is provided by the excellent FlowPlayer, which supports playing mp4 videos out-of-the-box.

Right now, video4all only supports videos that are statically added to your page. I hope to add support for dynamic addition of videos soon. The videos must be encoded in both video/mp4 and video/ogg formats to properly support Firefox, Safari and the Flash fallbacks. You’ll need to ensure that your video sources are properly tagged with the correct MIME types so that the script can pick them up.

The currently released browsers (that I know of) that support <video> are:

  • Firefox 3.5
  • Safari 4
  • iPhone 3.0

This project extends support for <video> to:

  • IE6+
  • Firefox 3.0
  • Safari 2-3
  • Opera (9.x)

For more info, visit the project page.

Here’s a demo (hosted in an iframe):

7 Responses to “HTML5 <video> support for older browsers”

  1. […] Cross-browser My colleague Matt Mastracci from DotSpots has just released support for the HTML 5 <video>tag across browsers. Legacy browsers are also supported. Please see Matt’s post HTML 5 <video> support for older browsers. […]

  2. Dao says:

    Doesn’t seem to work for Safari on Windows sans Quicktime.

    • Dao,

      Thanks for the feedback. I’ll try it out and see if there’s a way that I can detect that the codecs aren’t available. In the first revision, I’m assuming that every video-capable browser supports either ogg or theora.

  3. Silvia says:

    If you only wanted to support the Ogg Theora format, you could use a library such as mv_embed (http://metavid.org/w/index.php/Mv_embed), or the one from pad.ma at http://footage.stealthisfilm.com/static/javascript/player.js, or the one from CELT at http://www.celt-codec.org/presentations/video.js for different kind of fall-back mechanisms. The ultimate fall-back for Ogg is a java player called cortado, which will enable basically every browser to play Ogg.

    Also, you might encourage people to install XiphQT for Safari/Webkit/Quicktime to get Ogg Theora support into their QuickTime media framework. And finally you can encourage them to install oggcodecs if they are on Windows. That should make it much easier to focus just on one codec.

  4. Gerard says:

    What is the status of this project? Is it still supported? Seems like a this is what I’m looking for but it seems to be almost finished in october 2009….

    • Matt says:

      Gerard,

      There wasn’t a lot of interest in this project around the time I released it. It’s functional enough to work for a lot of cases as-is. The downlevel browsers that it doesn’t support dynamic tags in are dropping pretty fast in market share.

      If you have any particular items that aren’t addressed here, let me know (or file them as issues here: http://code.google.com/p/video4all/issues/list).

  5. Arron Hunt says:

    Google Chrome…..?