HTML视频无法在移动设备上播放?如何正确设置?

时间:2017-11-06 13:35:45

标签: javascript html css html5 video

好吧,我以前从未使用过HTML视频标签,但是如果要确保视频可以在所有常见浏览器上同时在桌面移动设备上播放,那么我很困惑。

这就是我所拥有的,目前正在开发Safari移动设备(加载时间之后)以及桌面Chrome和Safari:

<div id = "centered">

                <video poster="../resources/Anim5.png" id="bgvid" playsinline autoplay loop controls>

                        <source src="../resources/anim.webm" type="video/webm">
                        <source src="../resources/anim.mp4" type="video/mp4">
                        </video>

我希望视频具有控件和自动播放功能。我知道视频div正在显示,因为我只是在移动设备上获取海报图片,但在移动视频的Chrome中无法播放。

我认为这是一个自动播放问题,但无论出于何种原因,我都无法控制显示 - 尽管在标签中包含了这些内容。

这里的HTML视频配置是什么?我搞砸了什么?

1 个答案:

答案 0 :(得分:1)

添加muted playsinlineautoplay属性,以便在移动设备上使用。