X5内核浏览器,video兼容
使用vue-video-player在移动端微信内置浏览器打开,点击视频自动全屏问题。 参考官方 API 是 H5 同层浏览器的原因,可通过设置video属性来处理。
<video-player class="video-player vjs-custom-skin "
ref="videoPlayer"
:playsinline='true'
:options='videoOptions'
@canplay="onPlayerCanplay($event)"
>
</video-player>
onPlayerCanplay (player) {
let ua = navigator.userAgent.toLocaleLowerCase()
// x5内核
if (ua.match(/tencenttraveler/) != null || ua.match(/qqbrowse/) != null) {
$('body').find('video')
.attr('x-webkit-airplay', 'true') //设置允许设备播放
.attr('x5-playsinline', 'true') // 设置android在微信中内联播放视频
.attr('x5-video-player-type','web') // 关闭同层X5内核播放器 x5-video-player-type='h5' 启用H5同层播放器
// .attr('x5-video-player-fullscreen','true') // 进入全屏通知
.attr('x5-video-orientation','portrait') //控制横竖屏 可选值: landscape 横屏, portraint竖屏 默认值:portraint
} else {
// ios端
// alert('ios')
$('body').find('video')
.attr('webkit-playsinline', 'true') //设置ios在微信中内联播放视频 ios9
.attr('playsinline', 'true') //设置ios在微信中内联播放视频 ios10/ios11
}
},
X5内核浏览器,video兼容的更多相关文章
- X5内核浏览器video自动全屏解决办法-canvas
最近在做手机端上面播放视频的项目,但是在安卓上面,video的播放是脱离页面,置于最顶层的,所以带来了很多问题,为了解决这个问题,查看了多方资料,写了下面简单的demo,方便以后使用. 下面就是运用c ...
- android 腾讯x5内核 浏览器
1.浏览器内核: 主流浏览器内核介绍(前端开发值得了解的浏览器内核历史) 浏览器内核历史介绍: 在android 4.4之前,浏览器用的还是webkit 在android 4.4之后,google就抛 ...
- X5 内核浏览器对json格式支持的一个小区别
var json1 = { "data": [{ "type": "pic", "filename": "P6 ...
- QQ浏览器X5内核问题汇总
原文:http://itindex.net/detail/53391-qq-浏览器-x5 常常被人问及微信中使用的X5内核的问题,其实我也不是很清楚,只知道它是基于android 4.2的webkit ...
- 转{QQ浏览器X5内核问题汇总}
转自https://www.qianduan.net/qqliu-lan-qi-x5nei-he-wen-ti-hui-zong/ 常常被人问及微信中使用的X5内核的问题,其实我也不是很清楚,只知道它 ...
- 微信、QQ浏览器X5内核问题汇总
一. 资料汇总 1.前端H5调起QQ浏览器的总结:http://km.oa.com/group/22486/articles/show/210189?kmref=search 2.Android We ...
- QQ浏览器X5内核问题汇总 转
常常被人问及微信中使用的X5内核的问题,其实我也不是很清楚,只知道它是基于android 4.2的webkit,版本号是webkit 534.今天正好从X5团队拿到了一份问题汇总,梳理下发出来,给各位 ...
- 静态集成腾讯TBS X5内核WebView,从微信提取新版30M浏览器内核打包进apk
目录 前情提要 第一步:下载老版本SDK得到jar 获取SDK 集成SDK 步骤二.下载提取最新TBS X5内核 方法1:从微信中提取 方法2:App内内访问tbs调试页安装新内核 步骤三.集成内核到 ...
- 腾讯X5内核使用详解(X5内核播放器使用如何去除控制栏全屏播放)以及一些注意事项
例子下载地址 https://www.lanzous.com/i2zsv5g GIT就不用了麻烦的不行 本人安卓刚学 就上X5内核弄了老长时间由于对maven 和idea不熟悉刚开始导包都是 ...
随机推荐
- c++中cin的基本使用方法
一.最主要的使用方法cin>> 接收一个数字.字符.字符串.遇"空格"."TAB"."回车"都结束 比如: <span s ...
- Oracle学习(一):基本操作和基本查询语句
文中以"--"开头的语句为凝视,即为绿色部分 1.知识点:能够对比以下的录屏进行阅读 SQL> --录屏工具spool,開始录制,并指定保存路径为c:\基本查询.txt SQ ...
- 《CS:APP》 chapter 9 Vitrual Memory 笔记
Vitrual Memory In order to manage memory more efficiently and with fewer errors, modern systems prov ...
- Extjs grid 某列点击弹窗
{ header : "单号", tooltip : '单号', dataIndex : 'transportCode', width : 130, sortable : true ...
- luogu1373 小a和uim之大逃离
题目大意 地面上出现了一个n*m的巨幅矩阵,矩阵的每个格子上有一坨0~k不等量的魔液.怪物各给了小a和uim一个魔瓶,说道,你们可以从矩阵的任一个格子开始,每次向右或向下走一步,从任一个格子结束.开始 ...
- 杂项-Java:JDBC
ylbtech-杂项-Java:JDBC JDBC(Java DataBase Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,可以为多种关系数据库提供统一访 ...
- K-means (PRML) in C++
原始数据 #include <iostream>#include <fstream>#include <sstream>#include <vector> ...
- [Swift]LeetCode1066. 校园自行车分配 II | Campus Bikes II
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- Redis(四)-配置
Redis 配置 Redis 的配置文件位于 Redis 安装目录下,文件名为 redis.conf. 你可以通过 CONFIG 命令查看或设置配置项. 语法 Redis CONFIG 命令格式如下: ...
- 使用node成功安装完某插件typescript后,在使用时提示:tsc(或xxx)不是内部或外部命令,也不是可运行的程序或批处理文件
具体出错情形: 使用npm安装typescript明明安装成功,但在使用时一直报错,报错语句为 tsc不是内部或外部命令,也不是可运行的程序或批处理文件 具体出错原因: node未正确安装,或相关环 ...