HTML5浏览器支持判断

首先判断浏览器是否支持html5,根据以往的经验判断浏览器类型以及版本 这里提供另外一张思路和方法。

创建个html5的特性 看浏览器是否存在 参考w3c

<script type="text/javascript"> 
function checkVideo()
{
if(!!document.createElement('video').canPlayType)
  {
  var vidTest=document.createElement("video");
  oggTest=vidTest.canPlayType('video/ogg; codecs="theora, vorbis"');
  if (!oggTest)
    {
    h264Test=vidTest.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
    if (!h264Test)
      {
      document.getElementById("checkVideoResult").innerHTML="Sorry. No video support."
      }
    else
      {
      if (h264Test=="probably")
        {
        document.getElementById("checkVideoResult").innerHTML="Yes! Full support!";
        }
      else
        {
        document.getElementById("checkVideoResult").innerHTML="Well. Some support.";
        }
      }
    }
  else
    {
    if (oggTest=="probably")
      {
      document.getElementById("checkVideoResult").innerHTML="Yes! Full support!";
      }
    else
      {
      document.getElementById("checkVideoResult").innerHTML="Well. Some support.";
      }
    }
  }
else
  {
  document.getElementById("checkVideoResult").innerHTML="Sorry. No video support."
  }
}
</script>

html代码:

<div id="intro">
<p><strong>许多时髦的网站都提供视频。HTML5 提供了展示视频的标准。</strong></p>

<p>检测您的浏览器是否支持 HTML5 视频:</p>

<div id="checkVideoResult" style="margin:10px 0 0 0; border:0; padding:0;">
<button onclick="checkVideo()" style="font-family:Arial, Helvetica, sans-serif;">Check</button>
</div>
</div>

 

posted @ 2013-04-12 17:49  s_p  阅读(441)  评论(0编辑  收藏  举报