<template>
<button @click="handleClick">切换全屏模式</button>
</template>
const handleClick = () => {
if(document.fullscreenElement) {
document.exixFullscreen()
} else {
document.documentElement.requestFullscreen()
}
}
// 方式1
document.onfullscreenchange = () => {
// do something
}
// 方式2
document.addEventListener('fullscreenchange', () => {
// do something
})
w3c标准 | 谷歌 | 火狐 | IE | |
---|---|---|---|---|
置为全屏模式 | requestFullScreen | webkitRequestFullScreen | mozRequestFullScreen | msRequestFullScreen |
退出全屏模式 | exitFullscreen | webkitExitFullscreen | mozCancelFullScreen | msExitFullscreen |
当前全屏模式的元素 | fullscreenElement | webkitFullscreenElement | mozFullScreenElement | msFullscreenElement |