如果浏览器同时支持html5视频和闪回后备加载 [英] Both html5 video and flash fallback loading if browser supports both
本文介绍了如果浏览器同时支持html5视频和闪回后备加载的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在我的项目中使用闪回后退进行Html5视频播放(如果它不支持html5)。
但如果浏览器同时支持这两个玩家,则会加载两个玩家帮助我。
I'm doing Html5 video play on my project with flash fallback (if it doesn't support html5). But both players are loaded if browser supports both. help me.
<video controls="controls" preload="auto" poster="image.url" >
<source src="video.url" type="video/ogg" />
<source src="video.url" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'/>
</video>
<object type="application/x-shockwave-flash" data="flowplayer-3.1.1.swf">
<param name="movie" value="flowplayer-3.1.1.swf" />
<param name="allowFullScreen" value="true" />
<param name="wmode" value="transparent" />
<param name="flashVars" value="config={'playlist':['image.url',
{'url':'video.url','autoPlay':false}]}" />
<img alt="Image" src="" width="191px" height="256px"
title="No video playback capabilities, please download the video below" />
</object>
推荐答案
只需放置<对象>
在< video>
标记内,使其成为带有源标记的兄弟。如果浏览器不支持< video>
,则会在内部呈现内容,类似于< noscript>
脚本关闭。
Just place the <object>
inside the <video>
tag, making it siblings with the source tags. If the browser does not support <video>
, it renders the contents inside, similar to <noscript>
if scripts were off.
<video controls="controls" preload="auto" poster="image.url" >
<source src="video.url" type="video/ogg" />
<source src="video.url" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'/>
<object type="application/x-shockwave-flash" data="flowplayer-3.1.1.swf">
<param name="movie" value="flowplayer-3.1.1.swf" />
<param name="allowFullScreen" value="true" />
<param name="wmode" value="transparent" />
<param name="flashVars" value="config={'playlist':['image.url',{'url':'video.url','autoPlay':false}]}" />
<img alt="Image" src="" width="191px" height="256px" title="No video playback capabilities, please download the video below" />
</object>
</video>
这篇关于如果浏览器同时支持html5视频和闪回后备加载的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文