现在的位置: 首页 > 软件开发 > 正文

检测浏览器是否支持HTML5的video标签

2010年10月29日 软件开发 ⁄ 共 635字 暂无评论 ⁄ 被围观 7+

随着HTML5的推出,部分浏览器已经开始良好的支持HTML5,但用户群大多还在使用老版本的不支持HTML5的浏览器,我们可以让网页自适应浏览器而采用不同的方法进行视频播放,例如在ie8及以下采用Flash播放器播放视频,在Safari中用HTML5的<video>标签播放视频。

比较简单的网页标签写法如下:

&lt;video width=&quot;320&quot; height=&quot;240&quot;&gt; 
  &lt;source src=&quot;myvideo.mp4&quot; type='video/mp4'&gt; 
  &lt;object&gt; 
  &lt;!-- 将Flash播放代码放置于此 --&gt; 
  &lt;object&gt; 
&lt;/video&gt;

上述写法的缺陷是,在火狐3.5浏览器上会出现灰色的空白或差号,用户感受不佳。

以下是在网页中检测浏览器是否支持html5的video标签的方法,采用JavaScript实现,适应性比较强,建议采用:

&lt;script type=&quot;text/javascript&quot;&gt;
function supports_video() { return !!document.createElement('video').canPlayType; }
if (supports_video()) {
	alert('恭喜!您的浏览器支&amp;lt;video&amp;gt;标签!');
} else {
	alert('抱歉,您的浏览器不支持&amp;lt;video&amp;gt;标签');
}
&lt;/script&gt;

根据函数的判断结果,在预留的div内写入相应的播放代码即可。

给我留言

您必须 [ 登录 ] 才能发表留言!

×
#