iphone - HTML5 视频标签在 Safari、iPhone 和 iPad 中不起作用

Question

我正在尝试创建一个 html5 网页，其中有一个像 13s 这样的小视频，我将该视频的 flash 版本转换为 3 种格式:使用 fireFogg 的 .ogv 、使用 firefogg 的 .webm 以及使用 HandBrake 应用程序的 .mp4我在页面中使用的 html 脚本:

<video  width="800" height="640" loop preload="false" autoplay  controls tabindex="0">
  <source src="xmasvideo/video.mp4" type="video/mp4" />
  <source src="xmasvideo/M&P-Xmas 2.ogv" type="video/ogv" />
  <source type="video/webm" src="xmasvideo/M&P-Xmas.webm" />
</video>

该视频在 Chrome 和 FireFox 中工作正常，但在桌面版 Safari 或 iPhone 或 iPad 上根本无法工作，输出只是一个空白页面，显示视频标签的控件，但没有加载任何内容

请注意，我的 Safari 版本支持 HTML5 视频

Answer 1

我在 iPhone 和 iPad 等苹果设备上遇到了同样的问题，我关闭了低功耗模式并且它起作用了，您还应该在视频标签中包含 playsinline 属性，如下所示:

<video class="video-background" autoplay loop muted playsinline>

只有在包含 playsinline 时才有效。