我可以在iPhone或Android上避免使用HTML5原生的全屏视频播放器吗？

Question

我建立了一个Web应用程序，该应用程序使用HTML5标签和JavaScript代码来呈现与正在运行的视频同步的其他内容。它在桌面浏览器（Firefox，Chrome和Safari）中非常有效。在iPhone或DroidX上，本机视频播放器弹出并接管屏幕，从而遮盖了我想与视频同时显示的其他动态内容。有没有办法解决？如有必要，我将弄清楚如何为这两个平台编写本机应用程序，但是如果我坚持使用HTML5 / JavaScript，则可以节省很多时间。

Answer 1

在iOS 10+中

Apple playsinline在iOS 10的所有浏览器中启用了该属性，因此可以无缝运行：

<video src="file.mp4" playsinline>

在iOS 8和iOS 9中

简短答案：使用iphone-inline-video，它可以进行内联播放并同步音频。

长答案：您可以通过略读视频而不是实际播放视频来模拟回放，从而解决此问题.play()。

Answer 2

有一个属性可以在iOS Web浏览器中启用/禁用在线媒体播放（如果您正在编写本机应用程序，则为allowsInlineMediaPlaybackUIWebView 的属性）。在iPhone上默认设置为NO，在iPad 上默认设置为YES。

幸运的是，你还可以如下调整HTML这种行为：

<video id="myVideo" width="280" height="140" webkit-playsinline>

...希望可以为您解决。我不知道它是否可以在您的Android设备上运行。这是一个webkit属性，所以可能会。值得一去。

Answer 3

这是一个Apple开发人员链接，其中明确指出-

在iPhone和iPod touch，这是小屏幕设备，“视频是不是在网页内呈现”

Safari设备特定的注意事项

现在：

该webkit-playsinline属性适用于iOS上的HTML5视频，但仅当您将网页另存为webapp时才适用 -如果在Safari中打开页面则不行

对于具有WebView的本机应用程序（或具有HTML，CSS，JS的混合应用程序），UIWebView允许内联播放视频，但前提是您将该类的allowsInlineMediaPlayback属性设置UIWebView为true