fullscreenchange 事件

DOM 事件 Event 对象

定义和用法

fullscreenchange 事件在以全屏模式查看元素时发生。

注释：此事件需要特定的前缀才能在不同的浏览器中工作（请参阅下面的更多实例）。

提示：请使用 element.requestFullscreen() 方法以全屏模式查看元素。

提示：请使用 element.exitFullscreen() 方法取消全屏模式。

实例

在全屏模式下查看页面时显示一些文本：

document.addEventListener("fullscreenchange", function() {
  output.innerHTML = "fullscreenchange event fired!";
});

亲自试一试

语法

在 HTML 中：

<element onfullscreenchange="myScript">

在 JavaScript 中：

object.onfullscreenchange = function(){myScript};

在 JavaScript 中，使用 addEventListener() 方法：

object.addEventListener("fullscreenchange", myScript);

亲自试一试

注释：Internet Explorer 8 或更早的版本不支持 addEventListener() 方法。

技术细节

冒泡： 支持
可取消： 不支持
事件类型： Event
支持的 HTML 标签： 所有 HTML 元素

浏览器支持

表中的数字注明了完全支持该事件的首个浏览器版本。 注释：每款浏览器都需要特定的前缀（请参阅括号内）：

事件 Chrome IE Firefox Safari Opera
fullscreenchange 45.0 (webkit) 11.0 (ms) 47.0 (moz) 5.1 (webkit) 15.0 (webkit)

实例

供跨浏览器代码使用的前缀：

/* 标准语法 */
document.addEventListener("fullscreenchange", function() {
  ...
});

/* Firefox */
document.addEventListener("mozfullscreenchange", function() {
  ...
});

/* Chrome, Safari 和 Opera */
document.addEventListener("webkitfullscreenchange", function() {
  ...
});

/* IE / Edge */
document.addEventListener("msfullscreenchange", function() {
  ...
});

亲自试一试

DOM 事件 Event 对象