Android的第一帧背景video无法显示

我有以下代码:

.background-video { position: fixed; z-index: -10; left: 50%; min-width: 100%; min-height: 100%; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); -webkit-background-size: cover; -moz-background-size:cover; background: url(video.jpg) no-repeat center center fixed; background-size: cover; } @media (max-width: 767px) { *::-webkit-media-controls-start-playback-button { display: none!important; -webkit-appearance: none } } 
  

解释会发生什么:

  • 在iOS Safari上,我隐藏了video播放按钮,它显示了video的第一帧。
  • 桌面video在无限循环中播放。
  • 当我切换到Android(Oppo R7s ColorOS 5.1.1)而不是第一帧浏览器显示黑色背景时。
  • 虽然在Nexus 5X And​​roid 6.0.1移动Chrome浏览器上一切正常但我可以看到背景图片

从我从互联网上发现的这种行为的原因可以在移动浏览器中禁用Javascript,但启用Javascriptfunction没有帮助。

如果有人有开发OPPO手机的经验,请告诉我们如何在这款手机上显示背景图像而不是黑色背景。

更新:即使赏金已过期,问题仍然存在。

    我对这个规则持怀疑态度:

     -webkit-appearance: none; 

    我会退出所有CSS,并一次添加一个规则,以find违规的个别规则,如果你还没有。 最终,你可能不得不在一个视图中妥协,但这样你应该能够最小化损害。