HTML5 <video> Tag Support For All Browsers
By on March 1st, 2010

Videos is a very big feature which will render Flash videos almost useless, however not every browser supports HTML5 yet, the few that do also are either development versions or beta versions.

So, as a developer how would you switch to HTML videos? Well, there is a way by using a new JavaScript API which adds support for the HTML5 <video> tag in all browsers.

The API in question is called “html5media” and makes use of jQuery to display the default HTML5 video player if the browser supports it, or defaults to Flowplayer if the browser does not support it.

This will ensure that your <video> tag will play in all browsers, irrespective of whether they support it or not, definitely a good way to start using HTML5 videos in your project.

The only downside of this API is that you will have to include a JavaScript library in all pages that you want to insert the HTML5 videos in as shown below.

HTML5 Video Support for All Browsers

Once you do that, the html5media JavaScript library will take care of displaying the videos to both HTML5 browsers as well those which do not support it.

Download and Learn more about html5media. You can also view the demo of the script in action by visiting this page on a HTML5 compliant browser and one which does not support it. The only downside of this is that your video needs to be encoded in either the h.264 codec (mp4) or Theora codec (ogv).

Tags: , , ,
Author: Keith Dsouza Google Profile for Keith Dsouza
I am the editor-in-chief and owner of Techie Buzz. I love coding and have contributed to several open source projects in the past. You can know more about me and my projects by visiting my Personal Website. I am also a social networking enthusiast and can be found active on twitter, you can follow Keith on twitter @keithdsouza. You can click on my name to visit my Google+ profile.

Keith Dsouza has written and can be contacted at keith@techie-buzz.com.
  • http://tech-nobility.blogspot.com Christoph

    I'm using the newest version of Opera's 10.50 pre-alpha browser which supports html5 to the fullest. I've viewed several of the demos, including http://9elements.com/io/projects/html5/canvas/ which is a rich canvas with sound and media. I'm not a developer, but I can definitely see the positive impacts this is going to have on the web. I'm very excited about it.

  • http://www.karlkelman.com Karl Kelman

    HTML5 is a great theory that isn't, IMHO, quite ready yet. I have many ski videos on my site, and, in order to get the full effect you need to see them in fairly high quality. The problem with the "use HTML5 and fall back to Flowplayer" idea is that Flowplayer deals with the buffering/pausing/bandwidth issues far better than the HTML5 browsers. All of the HTML5 browsers can have their little quirks with respect to dealing with how the video was encoded, and bandwidth issues.

    I'm in the process of trying to figure out how I can get Flowplayer to gracefully fail to HTML5, which, if I could figure it out, would probably be the best solution.

    If anyone has ideas on how to do that, let me know!

    -Karl Kelman

 
Copyright 2006-2012 Techie Buzz. All Rights Reserved. Our content may not be reproduced on other websites. Content Delivery by MaxCDN