The fullscreenchange event is fired immediately before the browser switches into or out of full-screen mode.

Bubbles Yes
Cancelable No
Interface Event
Event handler property onfullscreenchange

The event is sent to the Document which owns the Element which is transitioning into or out of full-screen mode. Another fullscreenchange event will be sent to the Element which is itself transitioning into or out of full-screen mode.

To find out whether the Element is entering or exiting full-screen mode, check the value of DocumentOrShadowRoot.fullscreenElement: if this value is null then the element is exiting full-screen mode, otherwise it is entering full-screen mode.

Examples

In this example, a handler for the fullscreenchange event is added to the Document.

document.addEventListener('fullscreenchange', (event) => {
  // document.fullscreenElement will point to the element that
  // is in fullscreen mode if there is one. If there isn't one,
  // the value of the property is null.
  if (document.fullscreenElement) {
    console.log(`Element: ${document.fullscreenElement.id} entered full-screen mode.`);
  } else {
    console.log('Leaving full-screen mode.');
  }
});

See Element: fullscreenchange event for another example.

Specifications

Specification Status
Fullscreen API Living Standard

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
fullscreenchange eventChrome Full support 45Edge Full support 12Firefox Full support 64
Full support 64
No support 47 — 64
Disabled
Disabled From version 47 until version 64 (exclusive): this feature is behind the full-screen-api.unprefix.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
No support 10 — 64
Alternate Name
Alternate Name Uses the non-standard name: mozfullscreenchange
IE Full support 11
Alternate Name
Full support 11
Alternate Name
Alternate Name Uses the non-standard name: MSFullscreenChange
Opera Full support 32Safari ? WebView Android Full support 45Chrome Android Full support 45Firefox Android Full support 64
Full support 64
No support 47 — 64
Disabled
Disabled From version 47 until version 64 (exclusive): this feature is behind the full-screen-api.unprefix.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
No support 10 — 64
Alternate Name
Alternate Name Uses the non-standard name: mozfullscreenchange
Opera Android Full support 32Safari iOS ? Samsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown
User must explicitly enable this feature.
User must explicitly enable this feature.
Uses a non-standard name.
Uses a non-standard name.

See also

Document Tags and Contributors

Last updated by: wbamberg,