Element.onfullscreenchange

The Element interface's onfullscreenchange property is an event handler for the fullscreenchange event that is fired when the element has transitioned into or out of full-screen mode.

Syntax

targetDocument.onfullscreenchange = fullscreenChangeHandler;

Value

An event handler for the fullscreenchange event, indicating that the element has changed in or out of full-screen mode.

Example

This example establishes a fullscreenchange event handler, handleFullscreenChange(). This function determines which element it was called on by checking the value of event.target, then compares the document's fullscreenElement value to the element to see if they're the same node.

This gives us a value, isFullscreen, which we pass into a function called adjustMyControls(), which we imagine to be a function that makes adjustments to the app's user interface to present itself optimally when it's in full-screen mode versus being displayed in a window.

function toggleFullscreen() {
  let elem = document.querySelector("video");

  elem.onfullscreenchange = handleFullscreenChange;
  if (!document.fullscreenElement) {
    elem.requestFullscreen().then({}).catch(err => {
      alert(`Error attempting to enable full-screen mode: ${err.message} (${err.name})`);
    });
  } else {
    document.exitFullscreen();
  }
}

function handleFullscreenChange(event) {
  let elem = event.target;
  let isFullscreen = document.fullscreenElement === elem;

  adjustMyControls(isFullscreen);
}

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
onfullscreenchange
71
15
79
12
12-14
64
10
No
58
15
12.1-15
5.1
71
≤37
71
18
64
10
50
14
12.1-14
12
Only available on iPad, not on iPhone.
10.0
1.0

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Element/onfullscreenchange