Android Chrome 上的背景视频为空白（黑色），适用于 PC

Question

您好，

我正在尝试制作一个视频作为网页的背景，它似乎可以在我的电脑上使用，但在我的 phone.
上却不行直到现在视频都没有显示，这就是为什么我给它添加了背景，但是现在，在弄乱了一段时间之后，我的 phone 确实尝试播放视频，但它最终变成了空白（黑色）。
这导致缺少背景图片和视频。
但是如果我在屏幕上按住 "Save video" 的选项弹出，所以我假设浏览器没有问题意识到应该是个视频，就是播放失败
导出设置可能是问题所在吗？

HTML

<video id="bgvid" autoplay>
  <source src="media/video.webm" type="video/webm">
  <source src="media/video.mp4" type="video/mp4">
  Your browser does not support HTML5 video.
</video>

CSS:

video#bgvid {
  position: fixed;
  min-height: 100%;
  min-width: 100%;
  top: 50%;
  left: 50%;
  z-index: -1;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background: url(/img/background.jpg) no-repeat;
  background-size: cover;
  opacity: 0.25; }

视频

     File size:    6.39 MB (6,706,607 bytes)
      Duration:    1m 16s
    Dimensions:    
         Width:    1280px
        Height:    546px (arbitrary, I know)
 Constant kbps:    700

 Any further information about the file can be extracted and provided upon request.

我试过评论 "opacity: 0.25;" 属性只是想看看这是否是 Android 的所有麻烦的原因，但不是。
我实际上是在 Jade 中编写所有内容，在 Brackets 中编写 SASS，这些是编译的 (Prepros) 代码。请注意。

Answer 1

朋友建议我用这个：http://vodkabears.github.io/vide/
这似乎在我的桌面浏览器上工作，但在我的 phone.
上不起作用所以我想这就解决了：我不应该期望在我的 phone.

上显示任何视频背景

Answer 2

不知道您是否注意到 vodkabears Vide.js 也有一个名为 "poster" 的背景图片，当浏览器不支持视频格式时作为回退

在此处查看文档 https://github.com/VodkaBears/Vide#readme 其中说：

以“.webm”、“.mp4”等多种格式准备您的视频以实现跨浏览器兼容性，同时添加带有 .jpg、.png 或 .gif 扩展名的海报：

我遇到了同样的问题 - chrome 上没有 android 的视频。我没有尝试动画 gif - 这可能有效但不符合视频质量

Android Chrome 上的背景视频为空白（黑色），适用于 PC

Background video is blank (black) on Android Chrome, works on PC

html

android

google-chrome

html5-video

您好，

HTML

CSS:

视频