首页> 开发问题 >前端问题 前端问题
完美解决安卓移动端视频层级最高的问题 修改video属性
作者：小萝卜 2019-08-16 【 H5 】 浏览 3701
简介移动端网站涉及到视频播放的时候，同时又有会员的判断，一般我们会用一个遮盖层去遮住视频，用以判断是否可以观看。但是在安卓系统下，打开移动端页面这个video的层级始终室最顶级的，这个时候我们需要改下video的属性值。
如图示效果：
但是在安卓系统下，打开移动端页面这个video的层级始终室最顶级的，如下图：
这种情况会造成不管是不是vip会员都能看这个视频勒，这个时候我们需要改下video的属性值，如下：
< 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>
各个属性的参考如下：
controls="controls" //为视频提供播放控件
x5-playsinline="" //在X5内核中让video标签播放不自动全屏
playsinline="true" //IOS微信浏览器支持小窗内播放
webkit-playsinline="true" //这个属性是ios 10中设置可以让视频在小窗内播放，也就是不是全屏播放
x-webkit-airplay="true"
x5-video-player-type="h5" //启用H5播放器,是wechat安卓版特性
x5-video-player-fullscreen="" //全屏设置，设置为 true 是防止横屏
x5-video-orientation="portraint" //播放器支付的方向，landscape横屏，portraint竖屏，默认值为竖屏
很赞哦！ (0)
相关文章
文章评论
2020-11-07 11:33:14 网友
真的敢说完美了，安卓机的系统浏览器会让你很打脸
2020-04-01 15:11:22 北京北京网友
你确定可以解决android手机层级问题？
