微信X5浏览器video标签兼容性
程序员文章站
2022-07-03 08:57:43
实现需求：要求在页面内播放视频，不能弹窗播放，不全屏播放实现方式：解决的兼容性：微信浏览器打开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