Internet Explorer 8中的HTML5视频

Question

I know that the <video> tag doesn't work well in Internet Explorer 8, and that's fine. What I want to do is, if the user tries to open the link with IE8, display an error saying something like you're using browser XX and it's not supported .

I tried this:

<video id="ivideo" src="skins/Sandbox_Light/styleVideos/anima.mp4" controls onended="ivideo();" style="width:952px; height=435px" autoplay="autoplay">
  Not supported by your browser
</video>

However, instead I see a black div with an X in the middle, as if the problem was from the plugin missing. I tried to open this page and it works fine in IE9.

Answer 1

Use this piece of code to feature detect it:

function supports_video() {
    return !!document.createElement('video').canPlayType;
}

Courtesy of dive into html5: http://diveintohtml5.info/detect.html

Answer 2

Check out the ie6 blocker script in the link below.

Place this in a seperate file that loads the html 5

<!--[if <= IE 8]>
    <script type="text/javascript" src="jquery.ie6blocker.js"></script> 
<![endif]-->

    <video id="ivideo" src="skins/Sandbox_Light/styleVideos/anima.mp4" controls onended="ivideo();" style="width:952px; height=435px" autoplay="autoplay">

Then load the video through an iframe. I would recomend editing the script to justify what you are doing if needed.. also change the size of the image. Also, put a link to upgrade browser.

http://css-tricks.com/ie-6-blocker-script/