javascript - 移动设备上的 HTML5 视频行为

标签 javascript html mobile html5-video mobile-webkit

我正在构建一个站点,其中有多个 <video>作为我设计的一部分(而不是实际视频)的元素(循环动画)。这在桌面浏览器中工作得很好,但我在移动设备上遇到了麻烦。
当我在 Android 或 iOS 设备(即移动 webkit)上显示网站时,我将获得操作系统的视频播放器外观并且视频将打开在我单击它们时出现某种弹出窗口。我知道我可以通过以下方式绕过自动播放限制:

window.onload = function() {
    var pElement = document.getElementById("myVideo");
    pElement.load();
    pElement.play();
};

但这将再次在单独的窗口中打开视频...

有谁知道在移动设备上模拟/启用类似于桌面的行为的可能性吗?谢谢!

编辑: 标记是基本的 <video> -语法顺便说一句:

<video autoplay loop>
    <source src="vid.mp4" type="video/mp4" />
    <source src="vid.ogg" type="video/ogg" />
    <source src="vid.webm" type="video/webm" />
</video>

最佳答案

嗯,我不确定 Android 但 iOS devices can't run multiple video streams simultaneously :

Multiple Simultaneous Audio or Video Streams

Currently, all devices running iOS are limited to playback of a single audio or video stream at any time. Playing more than one video—side by side, partly overlapping, or completely overlaid—is not currently supported on iOS devices. Playing multiple simultaneous audio streams is also not supported. You can change the audio or video source dynamically, however. See “Replacing a Media Source Sequentially” for details.

关于javascript - 移动设备上的 HTML5 视频行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9000624/

相关文章:

javascript - 获取标签后和标签内的内部数字

html - 如何在html中将多个图像上传到服务器

javascript - 如何在没有DOM的情况下获取元素高度?

javascript - 我可以清除移动设备上触摸的 div 的焦点吗?

mobile - 移动应用程序如何与服务器通信?

javascript - 加载一组照片时,如何为每个 imageID 制作唯一的评论按钮功能?

javascript - 类型错误 : state is not iterable

javascript - 手机下滑效果

类似于 Python range() 的 JavaScript 函数

java - xml 的文档生成器给出错误