最开始去网上找了一些解决办法
1.设置弹出层CSS样式的z-index属性 越大越好 ,试过之后不行
2.有人说用canvas画布来实现,试了也不行
.........
原因:
原来由于现在微信内置浏览器采用腾讯X5内核,而这个坑爹的X5对web标准有很多刻意为之的不遵循,video强制全屏就是其一。 X5内核以增强用户体验为名,给video套上了自己的UI并强制全屏与置顶,这个全屏与层级不接受DOM层面的任何约束。
总结:没有正规的解决办法,但是可以换个思路去解决
1.弹出的时候让视频隐藏,点击取消或者确定之后再显示视频
2.弹出层与视频播放的区域进行分开隔离