HTML5视频的自动播放不起作用 [英] Autoplay of HTML5 video doesn't work

问题描述

我不确定为什么自动播放功能在网站上不起作用。
直播网站 - http://lyorcohen.searchinteractions.com/ComingSoon/

I am not sure why autoplay function doesn't work on site. Live site- http://lyorcohen.searchinteractions.com/ComingSoon/

<video class="supervideo hidden-phone hidden-tablet" poster="images/stillframe.jpg" autoplay>
<source src="video/WeaveLogo.mov" />
Your browser does not support the HTML5 video tag. Please upgrade it.
</video>

推荐答案

适用于Chrome但不适用于Firefox。

Works in Chrome but not in Firefox.

当MP4发生故障时，你也会在Firefox中出现这个错误（由于在不支持mp4的XP机器上进行测试）：

You also get this error in Firefox when the MP4 fails (due to testing this on an XP machine which does not support mp4 with Firefox):

HTTP加载失败，状态为404.媒体资源加载
http://lyorcohen.searchinteractions.com/ComingSoon/video/WeaveLogo.ogg
失败。

这意味着由于ogg文件丢失而导致回退失败。检查文件是否确实存在且名称拼写相同，包括大小写。

which means the fall-back fails due to the ogg file gone missing. Check that the file actually is there and that the name is spelled the same including capitalization.

在Chrome上，MP4视频自动播放并正常工作。

On Chrome the MP4 video auto-plays and works fine.

您还可以考虑提供该文件的 webm 版本。

You could also consider to provide a webm version of the file.

为了消除可能的原因，您可以在源代码中提供type属性：

To eliminate further possible causes you can provide the type attribute in your source tags:

<source src="video/WeaveLogo.webm" type="video/webm" />

您正在使用 autoplay 属性，但一些特殊的浏览器历来存在没有值的属性问题所以你可以添加 = true 来使这些浏览器感到满意（我只能考虑一个浏览器...） 。

You are using the autoplay attribute correctly but some peculiar browsers has historically had problems with attributes without values so you can add =true to it to make these browsers happy (I can only think about one browser though...).

这篇关于HTML5视频的自动播放不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！