js 点击整个网页全屏 再点退出全屏
时间: 2023-10-07 17:04:21 浏览: 38
可以使用JavaScript实现点击整个网页全屏和退出全屏的功能,具体实现代码如下:
进入全屏:
```javascript
function fullScreen() {
var element = document.documentElement;
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}
```
退出全屏:
```javascript
function exitFullScreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
}
```
然后,可以在页面中添加一个按钮或者其他元素,并绑定点击事件,当用户点击该元素时,调用上述函数即可实现全屏和退出全屏。例如:
```html
<button onclick="fullScreen()">全屏</button>
<button onclick="exitFullScreen()">退出全屏</button>
```