摘要：安卓端下的标签播放时会被浏览器接管。安卓下的内核浏览器，提供了相关属性。以下内容范围安卓在未被播放之前，标签属于正常文档元素，也是生效的。标签播放中和播放之后均会覆盖。删除标签，浏览器的视频播放组件会立即消失，时间大幅度缩短。
1.安卓端下的video标签播放时会被浏览器接管。此时已经脱离了文档流，并且与文档已经非同层了，所以设置z-index是无效的。
2.安卓下qq的x5内核浏览器，提供了相关属性。分别为：x5-playsinline：行内播放。x5-video-player-type="h5"：播放层级为文档层级。如果页面只有一个视频而且该视频在页面的顶部用起来还是比较顺心的。否则会发现，额。。。播放视频的时候会紊乱的。
所以移动端中，不建议做视频和dom重合的设计。
如果一定要做，请继续阅读。
以下内容范围：安卓
1.在video未被播放之前，video标签属于正常文档元素，z-index也是生效的。此时层级高的dom可以展示在video标签区域上方。
2.video标签播放中和播放之后均会覆盖dom。
3.浏览器同时只能播放一个video标签。当切换播放视频内容时体验不是很好：
浏览器播放组件切换视频时花费的时间可以明显的感知的到。
浏览器播放组件的底色一般是黑色，而我们的web底色大多时候不是黑色，切换时，会出现闪动。是由于浏览器播放组件的关闭然后再次打开造成的。
解决思路：
1.删除和添加video标签这一节点，这样做会让video标签恢复到1中的状态。
2.删除video标签，浏览器的视频播放组件会立即消失，时间大幅度缩短。
比如：
我们要解决弹窗被视频遮挡的问题，此时我们可以将视频这一节点刷新（删除后再次添加）
我们想要切换视频，就先把当前正在播放的视频刷新，然后播放下一个视频。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/102272.html
摘要：安卓端下的标签播放时会被浏览器接管。安卓下的内核浏览器，提供了相关属性。以下内容范围安卓在未被播放之前，标签属于正常文档元素，也是生效的。标签播放中和播放之后均会覆盖。删除标签，浏览器的视频播放组件会立即消失，时间大幅度缩短。 1.安卓端下的video标签播放时会被浏览器接管。此时已经脱离了文档流，并且与文档已经非同层了，所以设置z-index是无效的。2.安卓下qq的x5内核浏览器，...
阅读 3585·2023-04-26 01:43
阅读 2973·2021-10-14 09:42
阅读 5420·2021-09-30 09:59
阅读 2175·2021-09-04 16:40
阅读 1209·2019-08-30 15:52
阅读 825·2019-08-29 17:09
阅读 1994·2019-08-26 13:37
阅读 3434·2019-08-26 10:20
