Question

我在后台有一个大视频的网站，我使用了HTML5视频。它可以满足我在台式机上所需的一切，但我无法在平板电脑上使用它（在手机上不需要它） - 而不是视频我只看到黑色背景。

以下代码：

<div id="video-container">
<video autoplay loop class="fillWidth">
<source src="http://link/vid.mp4" type="video/mp4"/>
<source src="http://link/vid.ogv" type="video/ogg"/>
<source src="http://link/vid.webm" type="video/webm"/>
Your browser does not support the video tag. I suggest you upgrade your browser.
</video>

是否由自动播放选项引起？如果是这样，有没有解决方法？谢谢， S上。

Answer 1

在大多数移动浏览器（包括平板电脑 - 绝对是iPad）上，自动播放功能无效。浏览器不会下载任何视频文件，而不是第一帧甚至元数据，直到有某种用户交互事件 - 通常是点击或触摸

为缓解这种情况，您可以做的第一件事是在视频元素上设置poster属性，该属性是海报图片的URL。该图像应该立即可见，代替您的视频。如果你想加倍努力，你可以在身体上设置背景颜色，这样用户就可以看到他们正在等待加载海报图像。

接下来，只要用户与您的网页进行互动，您就可以在文档中随意添加触摸或点击事件监听器。

html5视频无法在平板电脑上运行

1 个答案: