The DeviceOrientationEvent
object provides web developers with information from the physical orientation of the device running the web page.
On this page
DeviceOrientationEvent
Constructor
-
DeviceOrientationEvent.DeviceOrientationEvent()
-
Creates a new
DeviceOrientationEvent
.
Instance properties
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.
Example
js
window.addEventListener("deviceorientation", (event) => {
console.log(`${event.alpha} : ${event.beta} : ${event.gamma}`);
});
Specifications
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
DeviceOrientationEvent |
59 | 14 | 17 | No | 46 | No | 59 | 59 | 17 | 43 | No | 7.0 |
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.
|
11 | 15 | 17 |
3Before version 50, Chrome provided absolute values instead of relative values for this event. Developers still needing absolute values may use thedeviceorientationabsolute event.
|
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.
|
absolute |
7 | 12 | 6 | 11 | 15 | 17 | 4.4 | 18 | 6 | 14 | 17 | 1.0 |
alpha |
7 | 12 | 6 | 11 | 15 | 17 | 3 | 18 | 6 | 14 | 4.2 | 1.0 |
beta |
7 | 12 | 6 | 11 | 15 | 17 | 3 | 18 | 6 | 14 | 4.2 | 1.0 |
gamma |
7 | 12 | 6 | 11 | 15 | 17 | 3 | 18 | 6 | 14 | 4.2 | 1.0 |
requestPermission_static |
No | No | No | No | No | No | No | No | No | No | 14.5 | No |
See also
© 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