gpt4 book ai didi

firefox - HTML5 视频和降级?

转载 作者:太空狗 更新时间:2023-10-29 15:58:28 29 4
gpt4 key购买 nike

我一直在玩弄 HTML5 video 标签,我对在不支持编解码器时如何最好地降级感到困惑?

对于根本不支持视频标签的旧浏览器(或 IE),这很简单:

<video width="320" height="240">
<source src="vid.ogv" type='video/ogg'>
<source src="vid.mp4" type='video/mp4'>
<object>
<!-- Embed Flash video here to play mp4 -->
<object>
</video>

他们将失败并获得 Flash 版本(或其他替代品,例如图像!)

当浏览器确实支持标签但不支持编解码器时如何 - 例如 FireFox 3.5 - 而我不支持 OGG(可能是因为我已经拥有大量的 H.264 文件):

<video width="320" height="240">
<source src="vid.mp4" type='video/mp4'>
<object>
<!-- Embed Flash video here to play mp4 -->
<object>
</video>

我在 FireFox 3.5 中得到的只是一个带有 x 的灰色框。这对 FireFox 用户来说并不是很好的用户体验!我只能想到使用 JavaScript 检查 FF3.5 并更改 DOM!这真的是旧事重演吗! ...还是我遗漏了规范的某些部分,例如“novideo”标签?

最佳答案

优雅降级的一个重要部分是查询功能……深入了解 HTML5 是一本很棒的读物……具体来说,请查看 video section .相关代码在这里:

function supports_h264_baseline_video() {
if (!supports_video()) { return false; }
var v = document.createElement("video");
return v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
}

注意:这确实需要 DOM 检查,但检查的是功能而不是浏览器签名。这是正确的做法 :-)

一旦您知道浏览器是否支持,您就可以显示您的视频标签或拉出灯箱或根据需要重定向。

关于firefox - HTML5 视频和降级?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1903779/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com