HTML5视频标记在Safari，iPhone和iPad中无法使用 [英] HTML5 Video tag not working in Safari , iPhone and iPad

问题描述

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

I am trying to create an html5 web page in which there is a small video like 13s , I converted the flash version of this video into 3 format : .ogv using fireFogg , .webm using firefogg also and .mp4 using HandBrake application the html script I used in my page :

<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，输出只是一个空白页面，显示视频标签的控件但没有加载任何内容

The video is working fine in Chrome and FireFox but not working at all neither in Safari on Desktop nor on iPhone or iPad , the output is simply a blank page that shows the controls of the the video tag but nothing is loaded

请注意，我支持的HTML版本的Safari版本

Note that the Safari version that I have supports HTML5 video

推荐答案

未来搜索者的另一种可能的解决方案：
（如果你的问题不是mimetype问题。）

Another possible solution for you future searchers: (If your problem is not a mimetype issue.)

由于某些原因，视频无法在iPad上播放，除非我设置了controls =true标志。

For some reason videos would not play on iPad unless i set the controls="true" flag.

示例：这适用于iPhone但不适用于iPad。

Example: This worked for me on iPhone but not iPad.

<video loop autoplay width='100%' height='100%' src='//some_video.mp4' type='video/mp4'></video>

这现在适用于iPad和iPhone：

And this now works on both iPad and iPhone:

<video loop autoplay controls="true" width='100%' height='100%' src='//some_video.mp4' type='video/mp4'></video>

这篇关于HTML5视频标记在Safari，iPhone和iPad中无法使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！