使用vue-video-player在移動端微信內置瀏覽器打開,點擊視頻自動全屏問題。 參考官方 API 是 H5 同層瀏覽器的原因,可通過設置video屬性來處理。 ...
使用vue-video-player在移動端微信內置瀏覽器打開,點擊視頻自動全屏問題。 參考官方 API 是 H5 同層瀏覽器的原因,可通過設置video屬性來處理。
<video-player class="video-player vjs-custom-skin " ref="videoPlayer" :playsinline='true' :options='videoOptions' @canplay="onPlayerCanplay($event)" > </video-player>
onPlayerCanplay (player) { let ua = navigator.userAgent.toLocaleLowerCase() // x5內核 if (ua.match(/tencenttraveler/) != null || ua.match(/qqbrowse/) != null) { $('body').find('video') .attr('x-webkit-airplay', 'true') //設置允許設備播放 .attr('x5-playsinline', 'true') // 設置android在微信中內聯播放視頻 .attr('x5-video-player-type','web') // 關閉同層X5內核播放器 x5-video-player-type='h5' 啟用H5同層播放器 // .attr('x5-video-player-fullscreen','true') // 進入全屏通知 .attr('x5-video-orientation','portrait') //控制橫豎屏 可選值: landscape 橫屏, portraint豎屏 預設值:portraint } else { // ios端 // alert('ios') $('body').find('video') .attr('webkit-playsinline', 'true') //設置ios在微信中內聯播放視頻 ios9 .attr('playsinline', 'true') //設置ios在微信中內聯播放視頻 ios10/ios11 } },