Fullscreen API exitFullscreen()

Example

Open the HTML page in fullscreen mode, and close it with a click of a button:

/* Get the documentElement (<html>) to display the page in fullscreen */
var elem = document.documentElement;

/* View in fullscreen */
function openFullscreen() {
if (elem.requestFullscreen) {
    elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
    elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
    elem.msRequestFullscreen();
}
}

/* Close fullscreen */
function closeFullscreen() {
if (document.exitFullscreen) {
    document.exitFullscreen();
} else if (document.webkitExitFullscreen) { /* Safari */
    document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE11 */
    document.msExitFullscreen();
}
}

Try it Yourself »

More "Try it Yourself" examples below.

Description

The exitFullscreen() method cancels an element in fullscreen mode.

Tip: Use the requestFullscreen() method to open an element in fullscreen mode.

Browser Support

The numbers in the table specify the first browser version that fully supports the method. Note: Some browsers require a specific prefix (see parentheses):

Method
exitFullscreen()	71.0 15.0 (webkit)	79.0 11.0 (ms)	64.0 9.0 (moz)	6.0 (webkit)	58.0 15.0 (webkit)

Syntax

HTMLElementObject.exitFullscreen()

Parameters

None

Technical Details

Return Value:	No return value

More Examples

You can use CSS to style the page when it is in fullscreen mode:

Example

/* Safari */
:-webkit-full-screen {
background-color: yellow;
}

/* IE11 */
:-ms-fullscreen {
background-color: yellow;
}

/* Standard syntax */
:fullscreen {
background-color: yellow;
}

Try it Yourself »

❮ Fullscreen API Reference Next ❯