Fullscreen API - Web APIs | MDN

developer.mozilla.org

Tin mới

HTML: Markup language

See all HTML references

Date & time formats

See all HTML guides

CSS: Styling language

See all CSS references

See all CSS guides

Centering an element

JavaScript: Scripting language

Standard built-in objects

Expressions & operators

Statements & declarations

See all JavaScript references

Control flow & error handing

Loops and iteration

Working with objects

See all JavaScript guides

Web APIs: Programming interfaces

Service worker API

Using the Web animation API

Using the Fetch API

Working with the History API

Using the Web speech API

All web technology

Progressive web apps

Learn web development

Getting started modules

Structuring content with HTML module

CSS styling basics module

Dynamic scripting with JavaScript module

Border-image generator

Border-radius generator

Box-shadow generator

Color format converter

Guide to the Fullscreen API

The Fullscreen API adds methods to present a specific Element (and its descendants) in fullscreen mode, and to exit fullscreen mode once it is no longer needed. This makes it possible to present desired content—such as a

Document.exitFullscreen()

Requests that the user agent switch from fullscreen mode back to windowed mode. Returns a Promise which is resolved once fullscreen mode has been completely shut off.

Element.requestFullscreen()

Asks the user agent to place the specified element (and, by extension, its descendants) into fullscreen mode, removing all of the browser's UI elements as well as all other applications from the screen. Returns a Promise

Document.fullscreenElement

The fullscreenElement property tells you the Element that's currently being displayed in fullscreen mode on the DOM (or shadow DOM). If this is null, the document (or shadow DOM) is not in fullscreen mode.

ShadowRoot.fullscreenElement

The fullscreenElement property tells you the Element that's currently being displayed in fullscreen mode on the DOM (or shadow DOM). If this is null, the document (or shadow DOM) is not in fullscreen mode.

Document.fullscreenEnabled

The fullscreenElement property tells you the Element that's currently being displayed in fullscreen mode on the DOM (or shadow DOM). If this is null, the document (or shadow DOM) is not in fullscreen mode.

Document.fullscreen

A Boolean value which is true if the document has an element currently being displayed in fullscreen mode; otherwise, this returns false.

Permissions Policy

The availability of fullscreen mode can be controlled using a Permissions Policy. The fullscreen mode feature is identified by the string "fullscreen", with a default allowlist value of "self", meaning that fullscreen mo

Simple fullscreen usage

In this example, a video is presented in a web page. Pressing the Enter key lets the user toggle between windowed and fullscreen presentation of the video.

Simple fullscreen usage

In this example, a video is presented in a web page. Pressing the Enter key lets the user toggle between windowed and fullscreen presentation of the video.

Learn how to contribute

This page was last modified on Mar 26, 2026 by MDN contributors.

Document: fullscreenchange

Document: fullscreenerror

Element: fullscreenchange

Element: fullscreenerror

Community resources