ScreenOrientation: change event

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨March 2023⁩.

The change event of the ScreenOrientation interface fires when the orientation of the screen has changed, for example when a user rotates their mobile phone.

Syntax

Use the event name in methods like addEventListener(), or set an event handler property.

js
addEventListener("change", (event) => { })

onchange = (event) => { }

Event type

A generic Event.

Example

In the following example, the change callback prints the new screen orientation type and angle.

js
screen.orientation.addEventListener("change", (event) => {
  const type = event.target.type;
  const angle = event.target.angle;
  console.log(`ScreenOrientation change: ${type}, ${angle} degrees.`);
});

Specifications

Specification
Screen Orientation
# dom-screenorientation-onchange

Browser compatibility