H5视频进入全屏状态时,手机横屏旋转
H5视频进入全屏状态时,手机横屏旋转,VUE3写法:
onMounted(()=>{
let video = document.getElementById(props.videoId);
video.addEventListener('fullscreenchange', (e) => {
if (methods.checkIsFullScreen()) {
console.log("进入全屏");
methods.lockOrientation('landscape') // landscape:表示横屏
} else {
console.log("退出全屏");
methods.lockOrientation('portrait') // portrait:表示竖屏
}
});
})
const methods={
checkIsFullScreen() { //判断是否进入全屏
var isFullScreen = document.fullscreen || document.mozFullScreen || document.webkitIsFullScreen;
return isFullScreen == undefined ? false : isFullScreen;
},
lockOrientation(orientation) {
if (typeof plus !== 'undefined' && typeof plus.screen !== 'undefined') {
plus.screen.lockOrientation(orientation) //手机横屏竖屏旋转
}
}
}

