问题描述：

使用famework7框架搭建了一个界面，然后再界面中需要使用蒙版效果，在PC端，ios测试没有问题，在Andriod播放视屏再点击显示蒙版的效果师，视频会遮盖蒙版。修改定位，z-index都没有用。

安卓手机内置x5内核，x5内核不遵循许多web标准，vedio层级最高，播放时不支持所有DOM层面的操作，所以并没有好的解决方案，最后采用的解决方案就是在点击视频播放按钮之后使视频全屏覆盖。

以下是我在原有代码基础上添加的内容,可供遇到同样问题的你使用：

给vedio标签添加属性，播放时全屏覆盖

<video src="https://hy.v.netease.com/2018/1030/5c9caed3eea6c6e079673d031fca3350qt.mp4" controls="controls" x5-playsinline="" playsinline="true" webkit-playsinline="true" x-webkit-airplay="true" x5-video-player-type="h5" x5-video-player-fullscreen="" x5-video-orientation="portraint"></video>

关于移动端开发，vedio标签层级高遮挡蒙版的解决方案的更多相关文章

  1. HTML5-前端开发很火且工资很高?

    前言 晚上逛论坛看到一篇对从事HTML5前端开发的文章写的非常不错,和目前的市场形势差不多,然后我在其基础上给大家进行加工总结一下分享给大家.今天我们谈论的话题是<<为什么从事HTML5前 ...

  2. web移动端开发技巧与注意事项汇总

    一.meta的使用 1.<meta name="viewport" content="width=device-width,initial-scale=1.0, m ...

  3. 移动端开发viewport深入理解（转）

    一.viewport的概念   移动设备上的viewport就是设备的屏幕上能用来显示我们的网页的那一块区域,就是浏览器上用来显示网页的那部分区域,但viewport不局限于浏览器可视区域 的大小,它 ...

  4. web移动端开发技巧

    一.meta的使用 1.<meta name="viewport" content="width=device-width,initial-scale=1.0, m ...

  5. 原生js开发，无依赖、轻量级的现代浏览器图片懒加载插件，适合在移动端开发使用

    优势 1.原生js开发,不依赖任何框架或库 2.支持将各种宽高不一致的图片,自动剪切成默认图片的宽高 比如说你的默认图片是一张正方形的图片,则各种宽度高度不一样的图片,自动剪切成正方形. 完美解决移动 ...

  6. Taro 多端开发的正确姿势：打造三端统一的网易严选（小程序、H5、React Native）

    笔者所在的趣店 FED 早在去年 10 月份就已全面使用 Taro 框架开发小程序(当时版本为 1.1.0-beta.4),至今也上线了 2 个微信小程序.2 个支付宝小程序. 之所以选用 Taro, ...

  7. 移动端开发demo—移动端web相册（一）

    本文主要是介绍开发移动端web相册这样一案例用到的前置知识. 一.移动端样式 移动端更接近手机原生的方式. 如下是一个angular mobile的demo的例子: 移动端demo做成这样的好处: 在 ...

  8. 29.html5 移动端开发总结

    手机与浏览器 浏览器: 移动端开发主要针对手机,ipad等移动设备,随着地铁里的低头族越来越多,移动端开发在前端的开发任务中站的比重也越来越大.各种品牌及尺寸的手机也不尽相同.尺寸不同就算了分辨率,视 ...

  9. 前端开发-3-HTML-body标签

    body标签 h.p.a.ul.ol.div.img. 想要在网页上展示出来的内容一定要放在body标签中. 把我们之前海燕那一段HTML代码贴过来,保存到一个HTML格式的文件中. <!DOC ...

随机推荐

  1. [原创]SecureCRT终端软件连接VMware Workstation Pro虚拟机

    Step1:检查主机的桥接有没有禁用 Step2:进入Ubuntu系统,进入到Ubuntu下,先查看Ubuntu虚拟机的IP配置,打开终端(Ctrl+Alt+T),通过ifconfig命令查看,可以看 ...

  2. Android开发资源收集

    收集Android开发用得上的资源,方便查询 像大牛一样写代码: 31个Android 开发者工具 Android 流行框架查速表 数据结构和算法练习awesome-java-leetcode And ...

  3. UOJ#41. 【清华集训2014】矩阵变换 构造

    原文链接https://www.cnblogs.com/zhouzhendong/p/UOJ41.html 题解 首先写个乱搞: 一开始每一行都选择第一个非0元素,然后,我们对这个方案不断做更新,直到 ...

  4. Unity 图形处理（切分与拉伸）

    素材的导入设置 1.导入的图片要设置为 Sprite 才能作为UI使用 2.如果需要进行切分,Sprite Mode 选择 Multiple 进行切分和拉伸设置 1.点击进入精灵编辑视图 2.点击按钮 ...

  5. 封装PDO函数

    funPDO.php <?php /** * @title: 封装PDO函数 * * @Features: * 1. 封装 SELECT ,INSERT,DELETE,UPDATE 操作 @do ...

  6. spring为什么推荐使用构造器注入？

    闲谈 ​ Spring框架对Java开发的重要性不言而喻,其核心特性就是IOC(Inversion of Control, 控制反转)和AOP,平时使用最多的就是其中的IOC,我们通过将组件交由Spr ...

  7. Android中Adapter类的使用 “Adapter”

    Adapter用来把数据绑定到扩展了AdapterView类的视图组(例如:ListView或Gallery).Adapter负责创建代表所绑定父视图中的底层数据的子视图. 可以创建自己的Adapte ...

  8. 如何删除github上的某个文件夹

    在github上只能删除仓库,却无法删除文件夹或文件, 所以只能通过命令来解决 首先进入你的master文件夹下, Git Bash Here ,打开命令窗口 $ git –help 帮助命令 $ g ...

  9. ESP32 Eclipse开发环境构建与问题总结

    搞了一个多星期的eclipse环境构建,终于成功了,在此记录下期间遇到的问题. 以下为遇到的几点问题的解决方法: 1.使用的版本为V3.1版本,版本时间为2018年09月07日,可以直接在以下路径下载 ...

  10. 离校登记网页项目个人总结（Alpha阶段）

    个人小结 在Alpha阶段,我和我的小团队六人,经过六天的努力完成了我们最初需求分析里的基本功能,在这里为我们团队的成功表示祝贺.在这个过程中,对于自己的表现觉得既有做的好的方面,也有很多不足需要改进 ...