English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
exitFullscreen()Method used to exit the full-screen mode of the current document.
This method requires a specific prefix to be used in different browsers (see the browser compatibility below).
UsagerequestFullscreen()Methods to open elements in full-screen mode.
document.exitFullscreen()
/* Get the (<html>) element to display the page in full screen */
var elem = document.documentElement;
/* View in fullscreen */
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) {/* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
}
/* Close fullscreen */
function closeFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.mozCancelFullScreen) { /* Firefox */
document.mozCancelFullScreen();
else if (document.webkitExitFullscreen) { /* Chrome, Safari and Opera */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE/Edge */
document.msExitFullscreen();
}
}Test and see‹/›The numbers in the table specify the first browser version that fully supports the method. Each browser requires a specific vendor prefix:
| Method | |||||
| exitFullscreen() | 15.0 (webkit) | 9.0 (moz) | 12.10(webkit) | 5.1(webkit) | 11.0 (ms) |
| Return Value: | None |
|---|
When the page is in full-screen mode, you can use CSS to set the page style:
div:-moz-full-screen {
background-color: pink;
}
div:-webkit-full-screen {
background-color: pink;
}
div:fullscreen {
background-color: pink;
}Test and see‹/›