Looking for the old docs? Go here


Screen Orientation

An overview on requesting and tracking screen orientation changes.

The player uses the native Screen Orientation API to lock and unlock the document’s orientation. You can request screen orientation changes by using the remote control or via methods on the player instance.


All Screen Orientation API methods are not available in all browsers. For example, iOS Safari does not support lock and unlock.

The media remote provides methods for dispatching media-orientation-lock-request and media-orientation-unlock-request events like so:


Learn more about the screen orientation lock types available.

The lock() and unlock() methods on the ScreenOrientationController can be used to change the orientation like so:


The following screen orientation properties are available on the media store:

  • canOrientScreen: Whether the Screen Orientation API and required methods are available.
  • orientation: The current screen orientation.

The following media data attributes are available for styling based on the current screen orientation state:


The following events are available for detecting screen orientation changes: