Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
The DeviceOrientationEvent interface of the Device Orientation Events provides web developers with information from the physical orientation of the device running the web page.
DeviceOrientationEvent.DeviceOrientationEvent()Creates a new DeviceOrientationEvent.
DeviceOrientationEvent.absolute Read only
A boolean that indicates whether or not the device is providing orientation data absolutely.
DeviceOrientationEvent.alpha Read only
A number representing the motion of the device around the z axis, express in degrees with values ranging from 0 (inclusive) to 360 (exclusive).
DeviceOrientationEvent.beta Read only
A number representing the motion of the device around the x axis, express in degrees with values ranging from -180 (inclusive) to 180 (exclusive). This represents a front to back motion of the device.
DeviceOrientationEvent.gamma Read only
A number representing the motion of the device around the y axis, express in degrees with values ranging from -90 (inclusive) to 90 (exclusive). This represents a left to right motion of the device.
DeviceOrientationEvent.webkitCompassHeading Non-standard Read only
A number represents the difference between the motion of the device around the z axis of the world system and the direction of the north, express in degrees with values ranging from 0 to 360.
DeviceOrientationEvent.webkitCompassAccuracy Non-standard Read only
The accuracy of the compass means that the deviation is positive or negative. It's usually 10.
window.addEventListener("deviceorientation", (event) => { console.log(`${event.alpha} : ${event.beta} : ${event.gamma}`); });
| Specification |
|---|
| Device Orientation and Motion # deviceorientation |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | ||
DeviceOrientationEvent |
59 | 14 | 17 | 46 | No | 59 | 17 | 43 | No | 7.0 | 59 | |
DeviceOrientationEvent |
7Before version 50, Chrome provided absolute values instead of relative values for this event. Developers still needing absolute values may use thedeviceorientationabsolute event. |
12 | 6Firefox 3.6, 4, and 5 supportedmozOrientation instead of the standard DeviceOrientationEvent interface. |
15 | 17 | 18Before version 50, Chrome provided absolute values instead of relative values for this event. Developers still needing absolute values may use thedeviceorientationabsolute event. |
6Firefox 3.6, 4, and 5 supportedmozOrientation instead of the standard DeviceOrientationEvent interface. |
14 | 4.2 | 1.0Before Samsung Internet 5.0, Samsung Internet provided absolute values instead of relative values for this event. Developers still needing absolute values may use thedeviceorientationabsolute event. |
3Before version 50, Chrome provided absolute values instead of relative values for this event. Developers still needing absolute values may use thedeviceorientationabsolute event. |
|
absolute |
7 | 12 | 6 | 15 | 17 | 18 | 6 | 14 | No | 1.0 | 4.4 | |
alpha |
7 | 12 | 6 | 15 | 17 | 18 | 6 | 14 | 4.2 | 1.0 | 3 | |
beta |
7 | 12 | 6 | 15 | 17 | 18 | 6 | 14 | 4.2 | 1.0 | 3 | |
gamma |
7 | 12 | 6 | 15 | 17 | 18 | 6 | 14 | 4.2 | 1.0 | 3 | |
requestPermission_static |
No | No | No | No | No | No | No | No | 14.5 | No | No | |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/DeviceOrientationEvent