Question

我创建了一个小网站，其中包含一段包含以下代码的视频：

    <video autoplay="autoplay">
        <source src="inc/WEB_MASTER.mp4" type="video/mp4">
        <source src="inc/WEB_MASTER_ios.m4v" type="video/mp4">
        Your browser does not support the video tag.
    </video>

当我通过iPhone加载页面时，视频开始播放，但它不会在网站的部分播放，而是iphone以全屏播放视频。如何强制iphone在网站上的相应区域播放视频？

感谢。

Answer 1

iPhone和iPod似乎是唯一在Safari（以及使用其未经修改的WebView的应用程序中）强制全屏视频播放的设备/浏览器

您可以通过略过视频而不是实际.play()来模拟播放来解决此问题。

我写了一个模块，负责播放视频内嵌并将其与音频同步（但它也适用于没有音轨的视频）：iphone-inline-video

Answer 2

这个问题在这里得到解答： HTML5 inline video on iPhone vs iPad/Browser

只需将webkit-playsinline属性添加到视频标记即可。适用于iOS 4.0及更高版本：

<video id="player" width="120" height="60" webkit-playsinline>

以下是webkit-playsinline的官方文档。

iPhone全屏播放嵌入式视频

2 个答案: