I am using following code to show video on my website. It is working perfect in Firefox and Google Chrome but not working in IE.
<video class="video-js" width="278" height="165" controls preload>
<source src="/uploads/video/encoding/mp4/<?php echo $video->getId() ?>.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="/uploads/video/encoding/ogg/<?php echo $video->getId() ?>.ogg" type='video/ogg; codecs="theora, vorbis"' />
<object id="flash_fallback_1" class="vjs-flash-fallback" width="278" height="165" type="application/x-shockwave-flash" data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf">
<param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":false}]}' />
</object>
</video>
I searched for that but not succeeded yet. Is there any programing solution of this without installing any third party plugin on IE.
Thanks
HTML5 is not supported by versions that came before IE9. Therefore, the video tag is not recognized. The object tag was introduced in HTML 4, but some earlier versions of IE either had bugs with it or did not support it at all.
In short, you need to create a fallback with the proprietary
<embed>...</embed>tag instead of<object>...</object>.OR
A better solution would be to use the HTML5shiv which creates the HTML5 elements through JavaScript for the previous versions of IE.
You would have to place the following in your head section:
You can view some interesting explanations and other useful tools on NetTuts+.