Safari不会播放HTML5视频 [英] Safari won't play HTML5 video

问题描述

我正在尝试为网站创建HTML5视频背景，但我似乎无法让它在Safari上运行。有没有人有任何想法？

I'm trying to create a HTML5 video background for a website but I cannot seem to get it to work on Safari. Does anyone have any ideas?

这是我正在使用的HTML视频标签

Here's the HTML video tags I'm using

<video id="bgVideo" class="bg__video" autoplay loop>
  <source src="./vid/Sample_Vid.ogv" type="video/ogv">
  <source src="./vid/Sample_Vid.m4v" type="video/m4v">
  <source src="./vid/Sample_Vid.webm" type="video/webm">
</video>

我已尝试在其下添加脚本标签以开始使用JS播放视频，但这没有帮助要么。

I've tried adding a script tag under it to start playing the video with JS but that's not helped either.

document.getElementById("bgVideo").play();

当我检查页面时，看起来视频元素占用DOM中的空间但它只是基本上看不见。

When I inspect the page it looks like the video element is taking up space in the DOM but it's just invisible basically.

我也尝试直接在浏览器中打开.m4v文件。它在那里播放所以我认为该文件不是问题。这些都来自 easyhtml5video.com

I've also tried opening the .m4v files directly in the browser & it plays it there so I assume the file isn't an issue. These were all generated from easyhtml5video.com

我也有Modernizer脚本，用于检测是否为浏览器启用了自动播放，我必须根据拉取请求进行更改在github repo 中，因为它总是说Safari不支持自动播放。

I also have the Modernizer script to detect if autoplay is enabled for the browser which I've had to alter based on a pull request in the github repo as it was always saying that Safari doesn't support autoplay otherwise.

我设置的测试网站是 http://treetopia.neilnand.co.uk/

推荐答案

Safari支持的视频格式为 mp4 ， H.264 编码。 （你有 .m4v 扩展名和文件类型）

The supported video format for Safari is mp4 with H.264 encoding. (you have a .m4v extension and file type)

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