研究大佬--video在微信浏览器下的层级过高问题(安卓：小米出现的问题)

还是上一篇的那个视频页面，真的是很烦

需求：这次需要判断网络状况，当非wifi状态下（即4g）出现提示弹框《当前处于移动数据网络》

设备：iphone7plus，ipad4，iphone5，安卓（小米），微信开发者工具

涉及元素及属性：div， 模态框，display，js

视频格式：mp4

问题：在除安卓设备（小米）以外，其他设备提示弹框正常渲染；安卓（小米）也会被渲染，但是被video遮挡

（这是我将视频大小调整后，发现隐藏在video标签下瑟瑟发抖的模态框）

分析：z-index都无法控制video的层级（父标签z-index：0重置后，给video-1，模态框9999）根本没效果，查看一些资料，发现大家都有这个问题，在微信小程序下，微信浏览器下，安卓设备中video层级过高，（和canvas，img都是层级较高），一些人解决方法用h5同级播放一些我没见过的代码（自行百度），然而没什么用。其实对于安卓机，腾讯已经有了提示弹框（对于使用移动数据网络），苹果机是没有的，因为需求在所以必须要写自己的提示弹框

解决方案：于是我就给video和模态框同级显示，用js判断，当安卓设备时，video隐藏，模态框显示，最后再控制video出现

代码如下：