html - 使用 HTML5 视频在 Firefox 中播放 MP4 文件

标签 html firefox html5-video mp4

我已经搜索了很多,但没有解决我的问题。

我有一个 video 标签运行如下:

<video 
  class="ne" 
  src="{{ page | video_url }}" 
  muted="true" 
  volume="0"  
  controls 
  width="720" 
  height="480" 
  poster="{{ page | video_poster_image_url }}" 
  type="video/mp4">
</video>

我正在使用 Jekyll 作为 URL。他们工作正常。

该站点的实时地址为 switzerlandllc.com .单击 FF 中的任何视频,它会显示一个图像和一个 X。Chrome 和其他浏览器可以正常工作。

如果您获取视频源并将其加载到新选项卡中,它可以正常播放。至少对我来说是这样。

我已经添加了:

AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm

到我的 htaccess 文件。我怀疑我不需要 .ogv.webm

我不明白为什么加载视频 URL 可以正常播放视频,但将视频加载到视频标签中却失败了。

有什么想法吗?

最佳答案

这是由于 Firefox 中视频标签内对 MP4 格式的支持有限所致。直到 Firefox 21 才添加支持,并且仍然仅限于 Windows 7 及更高版本。支持有限的主要原因是 mp4 格式的特许权使用费。

查看 Supported media formatsMedia formats supported by the audio and video elements直接从 Mozilla 团队或以下博客文章获取更多信息:

http://pauljacobson.org/2010/01/22/2010122firefox-and-its-limited-html-5-video-support-html/

关于html - 使用 HTML5 视频在 Firefox 中播放 MP4 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10488768/

相关文章:

html - 在 HTML 中是否有任何等效的 CSS max-width、border-radius、box-shadow 和 -...-transition?

javascript - 添加 API 后显示灰色框的 Google map 无法正常工作

html - 我的 css 导入失败

html - Flexbox 无法在 Firefox 中正常工作

html - 外部 CSS 形状 - Firefox 浏览器支持

java - 如何在 freemarker 中自定义数字格式?

html - 无序列表显示不正确

javascript - 如何显示来自 JSON 的视频?

javascript - iOS Safari 13 : how to hide live broadcast controls in <video> element

css - 视频在 chrome android 浏览器中超出父边框