前言

技术日新月异，本文仅记录截止 2019.12.11 的开发情况

背景

移动端 Web 页面开发，有视频功能。一切都运行得很好，只有在安卓微信有一个问题：视频会位于一切 dom 的最顶层，遮挡其他 dom。由此开始进行了一系列调查工作，整理成本文。

安卓与 Webview

https://jiandanxinli.github.io/2016-08-31.html
为了方便开发者实现在 app 内展示网页并与网页交互的需求，Android SDK 提供了 WebView 组件。
它继承自 AbsoluteLayout，展示网页的同时，也可以在其中放入其他的子 View。
具体涉及安卓开发的问题我也不太懂…

移动端浏览器内核介绍

微信与 X5 内核
https://www.v2ex.com/t/287717

视频同层播放问题

在 Android 手机上浏览器(比如：微信)播放视频时，浏览器会劫持视频的播放，使用的是浏览器自带的播放器弹出全屏播放视频，而且播放器是处于顶层的独立 view，会遮盖视频区域的其它元素，对于这部分案例没有有效的办法解决，但是由于 X5 内核的浏览器（微信、QQ 浏览器）提供了一些属性可以解决不劫持视频的播放和覆盖 Dom 元素，腾讯命名为同层播放，只针对 Android 的 X5 内核浏览器。
https://x5.tencent.com/tbs/guide/video.html

在微信中强制使用 webview

TODO

经验教训

移动端不建议做视频和 dom 重合的设计