An overview on requesting and tracking fullscreen mode changes.
RequestingSection titled Requesting
Requesting fullscreen has similar requirements to autoplay policies. In general, it will not work programatically until the user has interacted with the document first, or the request is in response to a user interaction like clicking or tapping a button. You can request fullscreen changes by using the remote control or via methods on the player instance.
Remote ControlSection titled Remote Control
The media remote provides methods for dispatching
media-exit-fullscreen-request request events like so:
MethodsSection titled Methods
exitFullscreen() methods are available on the player
component instance for requesting fullscreen changes:
TargetSection titled Target
By default, calling the
enterFullscreen() method will first attempt to use the
Fullscreen API so the custom media UI is displayed, otherwise it’ll fallback to
the current media provider.
You can specify that you only want to display the provider in fullscreen and not the entire media by specifying the fullscreen target like so:
By setting the target to
provider, the player will only request fullscreen on the media provider,
meaning your custom UI will not be displayed when in fullscreen.
StateSection titled State
The following fullscreen properties are available on the media store:
canFullscreen: Whether fullscreen is supported by the current browser or provider.
fullscreen: Whether the player is currently in fullscreen mode.
StylingSection titled Styling
The following media data attributes are available for styling based on the current fullscreen state:
EventsSection titled Events
The following events are available for detecting fullscreen changes or errors:
Screen OrientationSection titled Screen Orientation
You can specify the preferred fullscreen orientation like so:
This will lock the screen orientation as specified by
fullscreenOrientation while the media
enters fullscreen, and it will be unlocked while exiting. Keep in mind that this will only work
when the Screen Orientation API is available. See the
screen orientation page for more information.