做有态度的前端团队

网易FEG前端团队

安卓微信下video最顶层

问题:页面video在安卓微信下最顶层

一般我们做页面视频时,都是点击视频按钮弹出一个遮罩层再播放视频。然而当页面本身有一个视频video时,再点击另外的按钮弹层的时候又是怎样的状况?原先页面如下图:

video1.png

点击下面的 往期视频按钮 后是弹层播放视频,然而在安卓微信下的打开是这样的。

video4.jpg

打开方式错了吧?跟想象不一样哦,页面上的视频在遮罩层上面。。。那么我们第一反应应该是页面上video层级太高了吧,但是发现遮罩层的层级z-index:9999;已经是最高了。what?

但在自带浏览器以及苹果机能够正常显示(页面video在遮罩层下面)。

页面体验链接: https://test.nie.163.com/test_html/test*/
二维码:
video5.png

探究

度娘一下,原来这是一个源远流长的坑,然而还没找到比较深刻的解决方法...

对上面暂且的解决方式是:
点击 往期视频按钮 后 隐藏hide 页面video 后弹层;
关闭弹层就再显示show页面的video;
over~

记得之前与同学谈论过类似问题,我最后问他是如何解决的,他说“当初直接去找微信内部人员为域名添加白名单”。。。/托腮/无奈/哭笑

遂此问题有待后续深究

QQ图片20170323202440.png

手机阅读请扫描下方二维码:

已有 1 条评论

  1. Kevin

    那么如果, 无法找到微信人员对视频域名添加白名单, 但有视频播放需求, 如何解决视频层级最大的问题;
    或者说, 视频问题在微信安卓上确实是无解了的吗? 希望能得到您的解惑, 万分感谢

添加新评论

ali-40.gifali-41.gifali-42.gifali-43.gifali-44.gifali-45.gifali-46.gifali-47.gifali-48.gifali-49.gifali-50.gifali-51.gifali-52.gifali-53.gifali-54.gifali-55.gifali-56.gifali-57.gifali-58.gifali-59.gifali-60.gifali-61.gif