js 模仿f11 浏览器全屏显示
时间: 2023-05-29 16:02:56 浏览: 155
你可以使用以下代码实现全屏显示:
```javascript
function toggleFullScreen() {
if (!document.fullscreenElement && // 不在全屏模式下
!document.mozFullScreenElement &&
!document.webkitFullscreenElement &&
!document.msFullscreenElement ) { // 进入全屏模式
if (document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen();
} else if (document.documentElement.msRequestFullscreen) {
document.documentElement.msRequestFullscreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullscreen) {
document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else { // 退出全屏模式
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
}
}
```
然后在你的页面中添加按钮,并绑定 `toggleFullScreen` 函数即可。
```html
<button onclick="toggleFullScreen()">全屏</button>
```