微信X5浏览器video标签兼容性
程序员文章站
2022-04-08 22:49:45
实现需求:要求在页面内播放视频,不能弹窗播放,不全屏播放实现方式:解决的兼容性:微信浏览器打开video视频会自动全屏播放,设置x5-video-player-type="h5",h5同层播放器,仅在安卓微信X5浏览器可以。IOS使用playsinline="true" we...
实现需求:要求在页面内播放视频,不能弹窗播放,不全屏播放
实现方式:<video playsinline="true" webkit-playsinline="true" x5-video-player-type="h5" src="video.mp4"></video>
解决的兼容性:微信浏览器打开video视频会自动全屏播放,设置x5-video-player-type="h5",h5同层播放器,仅在安卓微信X5浏览器可以。IOS使用playsinline="true" webkit-playsinline="true"解决同层播放。
最终结果:在我的测试范围内,IOS没问题,安卓大部分机型没问题,仅华为荣耀V20和Nova6 5G(PS:Nova6 4G版没有出现问题)版这两款手机出现仍然被强制全屏播放,对应华为EMUI软件版本是10.0.0.194、10.0.1.173
本文地址:https://blog.csdn.net/qq_27962839/article/details/106380039