前端开发 从基础到框架

微信浏览器播放video自动全屏问题

2019-03-12  本文已影响12人  不7而遇_

微信浏览器用的是chrome的内核 播放会自动将视频全屏
要解决问题需要在video标签中添加如下内容

        webkit-playsinline="true"
        x-webkit-airplay="true"
        playsinline="true"

解决安卓部分浏览器问题的时候需要加上
x5-playsinline

即 完整代码如下

<video
       id="ad-video"
       src="http://static.chinaopen.ai/videos/ai2019_xc.mp4"
       muted
       loop
       autoplay="autoplay"
       preload="auto"
       poster="assets/img/videoimg.png"
       controls
       x5-video-player-fullscreen="true"
       webkit-playsinline="true"
       x-webkit-airplay="true"
       playsinline="true"
       x5-playsinline 
       class="video"
     >
上一篇下一篇

猜你喜欢

热点阅读