fullscreenchange 事件
定义和用法
fullscreenchange 事件在以全屏模式查看元素时发生。
Note:This event requires specific prefixes to work in different browsers (see more examples below).
Tip:Please use element.requestFullscreen(); Method to view the element in full-screen mode.
Tip:Please use element.exitFullscreen(); Method to cancel full-screen mode.
Example
Display some text when viewing the page in full-screen mode:
document.addEventListener("fullscreenchange", function() {
output.innerHTML = "fullscreenchange event fired!";
});
Syntax
In HTML:
<element onfullscreenchange="myScript">
In JavaScript:
object.onfullscreenchange = function() {myScript});
In JavaScript, use the addEventListener() method:
object.addEventListener("fullscreenchange", myScript);
Note:Internet Explorer 8 and earlier versions do not support addEventListener() method.
Technical Details
| Bubble: | Supported |
|---|---|
| Cancelable: | Not supported |
| Event type: | Event |
| Supported HTML tags: | All HTML elements |
Browser Support
The numbers in the table indicate the first browser version that fully supports this event. Note: Each browser requires a specific prefix (see inside the parentheses):
| Event | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| fullscreenchange | 45.0 (webkit) | 11.0 (ms) | 47.0 (moz) | 5.1 (webkit) | 15.0 (webkit) |
Example
Prefixes for cross-browser code usage:
/* Standard syntax */
document.addEventListener("fullscreenchange", function() {
...
});
/* Firefox */
document.addEventListener("mozfullscreenchange", function() {
...
});
/* Chrome, Safari at Opera */
document.addEventListener("webkitfullscreenchange", function() {
...
});
/* IE / Edge */
document.addEventListener("msfullscreenchange", function() {
...
});
