摘要:本篇文章主要讲述HTML5+CSS3从入门到精通之快速了解X5内核浏览器,video兼容,希望阅读本篇文章以后大家有所收获,帮助大家对相关内容的理解更加深入。
本篇文章主要讲述HTML5+CSS3从入门到精通之快速了解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 } },
本文由职坐标整理发布,学习更多的相关知识,请关注职坐标IT知识库!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号