黑色屏幕上的铬为Android html5视频

Question

问题: 视频放在我的网站上:http://dege.cloud/(点击其中一张图片)当我在桌面或Firefox浏览器上加载页面时,一切都很好.当相同的页面加载到chrome for android时,视频是黑色的,没有控件,视频没有音频,所以我不知道它是否播放.

预期结果: 视频应该可播放,hml5视频标签不会在移动设备上自动启动,但这不是问题.

分析: 视频的内容类型是正确的,检查设备上的控制台不会出错.我给了webm和mp4版本的视频(摘自http://giphy.com/).

视频代码如下:

<video autoplay muted loop class="img-responsive img-centered">
    <source src="img/portfolio/campominato-video.webm" type="video/webm" class="img-responsive img-centered">
    <source src="img/portfolio/campominato-video.mp4" type="video/mp4" class="img-responsive img-centered">
    <img src="img/portfolio/campominato-screen.png" class="img-responsive img-centered">
</video>

jsfiddle的问题在行动:https://jsfiddle.net/Dege/1es4516p/

Answer 1

据我所知，问题在于它会自动播放；虽然 Chrome Android 53 会自动播放静音视频，但当前的默认版本 (51) 不会。

无论如何，如果您将该controls属性添加到视频元素并按播放，视频就会正确播放，这证实这不是编码问题。

（FWIW，jsfiddle 在用于加载视频的 http 方案中有 3 个斜杠；这不是问题，但您可能想修复它）