问题描述：

使用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. Java使用线程池

    多线程主函数 package UnitTest; import java.util.ArrayList; import java.util.List; import java.util.concurr ...

  2. python第十五天

    什么是模块? 一系列功能的集合 定义模块? 创建一个py文件就是一个模块,该py文件名就是模块名 怎么使用模块? 在要是用的模块文件中通过import 模块名 来导入模块 模块的四种方式? 1.编译执 ...

  3. 原生js添加博客点击鼠标出小心心效果~~

    昨天刚申请成功JS权限,心血来潮想添加点东西,记得之前看到别人家博客首页点击鼠标的时候会出现炫酷的 “小心心”,自己也来搞一个.没有用jquery啥的框架,原生js写起来麻烦了点,不过主要是怕博客首页 ...

  4. Linux的vim编辑器

    vim编辑器常用的三种模式 vim /文件路径 进入编辑器,编辑该文件 例:vim /etc/passwd 命令行模式:在编辑器中直接输入命令 dd:删除光标所在的一行 ndd:删除光标所在的向下的n ...

  5. 【java】-- 线程安全

    1.线程安全问题介绍与案例分析 当多个线程同时共享,同一个全局变量或静态变量,做写的操作时,可能会发生数据冲突问题,也就是线程安全问题.但是做读操作是不会发生数据冲突问题. 案例:需求现在有100张火 ...

  6. 展开被 SpringBoot 玩的日子 《 六 》 整合 Mybatis

    上次整合了JPA ,但是很多人觉得JPA 并不是那么好用,这都是习惯问题,我本人也比较习惯Mybatis ,所以,今天就整合一下Mybatis,到网上找了一下关于spring boot和mybatis ...

  7. REM——适合移动开发的自适应方案

    文章目录 1.什么是REM 2.REM和EM的区别 3.手机端方案的特点 4.使用JS动态调整REM 5.REM与其他单位同时存在 1.什么是REM 先来认识几个常见单位: px:像素,这个大家都知道 ...

  8. URI ，URL 和 URN

    URI : 统一资源标识符,用来唯一标识互联网资源,包括URL和URN URL:统一资源定位器 包含: 协议,域名,端口,路由,参数,hash https://i.cnblogs.com/EditPo ...

  9. 自己封装element-ui树组件的过滤

    前言:vue开发项目时用到了element-ui的树组件,但是发现一执行过滤事件,树就全部都展开了,为了解决这个问题,只能自己先过滤数剧,再赋值给树组件的data,就避免了一上来全部展开的尴尬. 一. ...

  10. LeetCode笔记：39. Combination Sum

    题目描述 给定一个无重复的正整数数组 candidates 和一个正整数 target, 求所有和为 target 的 candidates 中数的组合中.其中相同数的不同顺序组合算做同一种组合,ca ...