js f11 打开和退出全屏事件
时间: 2024-09-30 07:12:09 浏览: 17
在JavaScript中,F11键通常用于浏览器进入全屏模式(Full-Screen Mode)。当你按下F11并保持,网页会变为全屏显示,而相应的事件会在全屏和非全屏状态下触发。
对于全屏状态下的事件,你可以关注以下几个:
1. `fullscreenchange` 或 `fullscreenerror` 事件:这两个事件分别在页面进入全屏模式或遇到错误退出全屏时触发。你可以监听这两个事件来处理状态切换的情况。
```javascript
document.addEventListener('fullscreenchange', function(event) {
if (document.fullscreenElement) {
console.log('现在处于全屏模式');
} else {
console.log('已退出全屏模式');
}
});
document.addEventListener('fullscreenerror', function(event) {
console.error('全屏操作出错:', event);
});
```
2. `mozfullscreenchange`, `webkitfullscreenchange`, 和 `msfullscreenchange`:这些是针对Firefox、WebKit(如Safari和Chrome)和IE的特定版本的全屏事件。
当用户按F11退出全屏时,上述的`fullscreenchange`事件将不再触发。如果你想在退出全屏时做些什么,可以监听窗口尺寸变化或者使用`resize`事件,因为从全屏到正常屏幕大小时,窗口大小会发生变化。