首先你可能想看看http://camendesign.com/code/video_for_everybody
如果你还没有遇到过。
无论如何,如果您想提供自定义 Flash 替代方案,这应该可以工作:
<video width="..." height="..." controls="controls" preload="none">
<source src="video/demo.mp4" type="video/mp4" />
<source src="video/demo.webm" type="video/webm" />
<source src="video/demo.ogv" type="video/ogg" />
<span id="flashAlternative">what, no flash+no html5? crazy!</span>
</video>
<script>
swfobject.embedSWF( ..., "flashAlternative", ... );
</script>
显然,如果您想使用 youtube/vimeo/... 视频作为替代,您只需放置嵌入代码而不是脚本标签:
<video width="..." height="..." controls="controls" preload="none">
<source src="video/demo.mp4" type="video/mp4" />
<source src="video/demo.webm" type="video/webm" />
<source src="video/demo.ogv" type="video/ogg" />
<!-- embedding code here -->
</video>
这两种解决方案都更喜欢 html5 视频而不是 flash 视频,如果您不想为大量带宽付费,您可能更愿意向所有拥有 flash 的人展示 youtube 视频,并且只有在这种情况下才回退到 html5无法使用。然后看起来像这样:
<object type="application/x-shockwave-flash" width="..." height="..." data="...">
<param name="movie" value="..." />
<video width="..." height="...">
<source src="..." type="video/mp4" />
<source src="..." type="video/webm" />
<source src="..." type="video/ogg" />
<!-- here comes the alternative for people who have neither flash, nor html5 -->
</video>
</object>
请注意,您不能只是从 youtube/video 复制嵌入代码并在其中 smush html5 视频,您需要对其进行修改,使其看起来像上面那样(数据和电影属性都指定了 swf 文件的来源,没有嵌入需要标签!)。