Videojs Flash Fallback Example

Posted Under: HTML5, JavaScript, Programming on Feb 20, 2013
Videojs Flash Fallback Example
VideoJS is a HTML5 Video Player, recently i started using it in a project i choose it for is supper easy installation which is easy by just adding one video.js file and video-js.css a css file, both are hosted on free CDN. While working on the project i find out that it does not fall back on it own when using an flv or MP4 source file in Firefox web browser, i googled a bit and found out that Firefox can not play MP4 files, to make consistent in all browser i have to force video.js to play in flash to make this this work you have to do the following in your embed code.

<video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264"
      data-setup='{"techOrder": ["flash", "html5"]}'>
    <source src="http://html5video.org/media/sintel.mp4" type='video/mp4' />

All you need is to change this order

data-setup='{"techOrder": ["flash", "html5"]}'

A sample player with the above config is shown below, it force videojs to fallback to flash.