阶段一: 直接裸用 video 标签, 安卓 - 会重新弹一个播放层, 和之前video的父盒子错位, 要多丑有多丑, 体验要多烂有多烂.

阶段二: video添加以下属性, 安卓可实现内联播放, 但是会层级过高, 遮住页面中的其他重叠元素.

<video

  x-webkit-airplay="allow"

  webkit-playsinline=""

  x5-playsinline=""

  playsinline=""

></video>

阶段三: 查看了腾讯浏览服务的官方文档, 发现了一个 x5-video-player-type="h5-page" 属性, 加上! 奇迹发生了 video内联播放了, 且没有挡住其他元素, 但是还有一个问题, 会出现一个全屏按钮, 挡住了我们业务的一个按钮, 但是已经好很多了!

<video

  x5-video-player-type="h5-page"

></video>

( 随便说说! 添加属性要一个个单独试, 不能看到什么属性, 就往项目上累加, 其实上面说的属性, 我之前都找到过, 但都是一股脑往项目扔, 结果一个都没起作用, 后面单独添加才出效果, 这要注意)

微信浏览器 video - android适配的更多相关文章

  1. 解决微信浏览器video全屏的问题

    解决微信浏览器video全屏的问题 在微信浏览器里面使用video标签,会自动变成全屏,改成下面就好了,起码可以在video标签之上加入其他元素. <video id="videoID ...

  2. 防止微信浏览器video标签全屏的问题

    在微信浏览器里面使用video标签,会自动变成全屏,改成下面就好了,起码可以在video标签之上加入其他元素. <video id="videoID" webkit-play ...

  3. 大事记 - 安卓微信浏览器 video 标签层级过高

    // 为什么叫<大事记>? // 以前总有面试官问这样一个问题:“你在项目中遇到过最头疼的问题是什么,是怎么解决的?” // 当时总觉得,已解决的问题都算不上头疼,所以回答总是不尽人意. ...

  4. 华为，小米部分机型微信浏览器rem不适配的解决方案

    针对近日华为,小米的部分机型,在升级系统或升级微信之后,微信内置浏览器产生的rem不能正确填充满的问题,有如下解决方案 目前来看,产生这个情况的原因是因为给html附font-size时,附上的fon ...

  5. 微信浏览器video播放视频踩坑

    video属性介绍 iOS的属性 playsinline On iPhone, video playsinline elements will now be allowed to play inlin ...

  6. 微信浏览器video

    <style> /* 解决上下有黑边,不能全屏 */ video{object-fit: fill;} </style> <video id="videoID& ...

  7. video 标签在微信浏览器的问题解决方法

    最近做的些web页面,内嵌许多小视频,在ios和安卓手机上播放时,遇到不少问题: 在微信浏览器内播放时,视频会自动全屏 如果每个视频都有一张自定义的图片作为封面,在显示视频的同时,如果没有给这个视频设 ...

  8. 微信浏览器安卓手机video浮在最上层问题

    微信浏览器安卓手机video浮在最上层问题 //x5-video-player-type="h5" x5-video-player-fullscreen="true&qu ...

  9. html5 video微信浏览器视频不能自动播放

    html5 video微信浏览器视频不能自动播放 一.微信浏览器(x5内核): 1.不能自动播放 2.全屏 3.最顶层(z层的最顶层) 二.ios系统解决方案:(无phone手机未测试) <au ...

随机推荐

  1. 唐太宗灵州勒石 TANGTAIZONGLINZHOULESHI

    唐太宗灵州勒石 唐贞观二十年(646年),在唐军和回纥部落联合打败突厥薛延陀部后,原归附薛延陀部的回纥.拔野古.斛薛等部族,越过贺兰山,进入了今宁夏的银川.吴忠一带地区.这些总族向唐朝提出,愿意臣服唐 ...

  2. BZOJ3625 CF438E 小朋友与二叉树

    心态崩了 不放传送门了 辣鸡bz 还是正经一点写一下题解= = 就是显然我们可以把权值写成生成函数形式g(0/1序列)来表示权值是否出现 然后f来表示总的方案数 可以列出 分别枚举左右子树和空树的情况 ...

  3. tmux使用——2019年11月20日16:40:15

    1.tmux 命令行的典型使用方式是,打开一个终端窗口(terminal window,以下简称"窗口"),在里面输入命令.用户与计算机的这种临时的交互,称为一次"会话& ...

  4. Halo（十一）

    Spring Boot 继承 AbstractErrorController 实现全局异常处理 @RequestMapping("${server.error.path:${error.pa ...

  5. 命令查看当前运行APP的包名和Activity

    先用usb链接手机 启动要查看的程序,命令查看当前运行的包名和Activity更清晰. 使用adb shell dumpsys window | findstr mCurrentFocus  命令查看 ...

  6. 阿里云数据库备份DBS商业化发布，数据库实时备份到OSS

    数据库备份DBS已于2018年5月17日正式商业化发布. 数据库备份(Database Backup,简称DBS)是为数据库提供连续数据保护.低成本的备份服务. 它可以为多种环境的数据提供强有力的保护 ...

  7. Mybatis的运行原理

    我们写的sql语句就在statementBuilder中. 整个mapper的信息都保存到configuration 1:根据配置文件创建SQLSessionFactory 先创建SqlSession ...

  8. 4412 i2c驱动

    1.Linux主机驱动和外设驱动分离思想 外设驱动→API→主机驱动→板机逻辑--具体的i2c设备(camera,ts,eeprom等等) 2.主机驱动 根据控制器硬件手册,操作具体的寄存器,产生波形 ...

  9. Equivalent Prefixes

    题目链接 题意:给你两个数组a,b,大小为n,让你寻找一个数p (1<= p <= n) ,使之在 1~p 任意一个区间中a,b数组的最小值下标相同. 思路:看到用线段树去写的我也是服了. ...

  10. [CSP-S模拟测试]:回文串（hash+二分）

    题目描述 $ASDFZ$的机房中不仅有红太阳,还有蓝太阳和原谅色太阳.有一天,太阳们来到机房,发现桌上有不知道哪个蒟蒻放上的问题:令$F(A,B)$表示选择一个串$A$的非空前缀$S$和串$B$的非空 ...