firefox:
requestFullscreen
click 可以觸發，pointer 無效
chrome:
requestFullscreen
click/pointer 均可觸發
- 參考代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>requestFullscreen</title>
</head>
<body>
<div id="btn" style="width: 200px; ;padding: 1em 2em; background-color: #fab;">點我吧 </div>
<script>
var element = document.getElementById('btn');
element.addEventListener('click', toggleFullScreen);
// element.addEventListener('pointerdown', toggleFullScreen); // 無效
// element.addEventListener('pointerup', toggleFullScreen); // 無效
function toggleFullScreen() {
if (!document.fullscreenElement &&
!document.mozFullScreenElement &&
!document.webkitFullscreenElement) {
if (document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullscreen) { document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.cancelFullScreen) {
document.cancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}
}
</script>
</body>
</html>
- 詳細資訊https://developer.mozilla.org/zh-CN/docs/DOM/Using_fullscreen_mode
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)