iOS在微信中不全屏播放及允许div元素在video上

我的代码
<video  class="video-player" preload src="" playsinline="" webkit-playsinline="" x5-video-player-type="h5">video>

腾讯视频的代码
<video style="background-color:#000;width:100%;height:100%" playsinline="isiPhoneShowPlaysinline" x5-video-player-type="h5-page" t7-video-player-type="inline" webkit-playsinline="isiPhoneShowPlaysinline" x-webkit-airplay="" preload="none" data-role="txp_video_tag" src="https://ugcsjy.qq.com/">video>

playsinline="" //IOS微信浏览器支持小窗内播放
webkit-playsinline="" //IOS微信浏览器支持小窗内播放
x5-video-player-type=“h5-page” //同层播放器窗口播放
x5-video-player-type=“h5” //同层播放器全屏播放
x5-video-player-fullscreen=“true” //同层播放器全屏播放

经真机测试,iOS和安卓微信浏览器只需加这三个属性即可实现不强制全屏播放,div元素等可以在video之上,实现弹幕效果。playsinline="" webkit-playsinline="" x5-video-player-type=“h5”
提示:x5-playsinline=""这个属性加了点击播放video后,div等任何元素就都无法在video之上。

腾讯H5同层播放器接入规范
iOS在微信中不全屏播放及允许div元素在video上_第1张图片

你可能感兴趣的:(前端开发)