Fullscreen API Changes
With Microsoft Edge, you can update your sites to match the latest Fullscreen API standard and simplify cross-browser code.
Going prefix-free
An implementation of the Fullscreen API was introduced in Internet Explorer 11. Due to the in-flux state of the standard, it was prefixed to represent its experimental state.
In Microsoft Edge, the Fullscreen API gets official support in the browser and the methods, properties, events, attributes and CSS selectors have been unprefixed.
The following table provides the two versions.
Unprefixed API | Prefixed API | Type | Description |
---|---|---|---|
requestFullscreen | msRequestFullscreen | Method | Requests full-screen display of an image, video, or other element. |
exitFullscreen | msExitFullscreen | Method | Returns an element to its original size from full-screen mode. |
fullscreenElement | msFullscreenElement | Property | Returns the top or current element that's being displayed in full-screen mode. Otherwise it returns undefined. |
fullscreenEnabled | msFullscreenEnabled | Property | Returns true if a document lets elements be displayed in full-screen mode. Otherwise it returns false. |
fullscreenChange | MSFullscreenChange | Event | Fires when an element is displayed in full-screen mode, or when it exits full-screen mode. |
fullscreenError | MSFullscreenError | Event | Fires when a full-screen display is requested of an element, but this request can't be fulfilled. |
:fullscreen | :-ms-fullscreen | Pseudo class | Enables you to set specific CSS properties based on whether an element is in full-screen mode or not. |
::backdrop | ::-ms-backdrop | Pseudo element | Enables you to set the background properties when an element is displayed in full-screen mode. |
allowfullscreen | allowfullscreen | Attribute | Enables an iframe's content to display in full-screen mode. If missing, only the iframe (and not the content within the frame) can go to full-screen mode. |
The recommended approach is to continue to use feature detection and support prefixing for all major browsers as is shown in many of the code samples on the Fullscreen API page.
Additionally, to provide improved compatibility with legacy code around the World Wide Web, many of the items above also support their webkit-prefixed variants as aliases.