Device orientation events are events that allow you to detect a device's physical orientation, as well as allowing you to detect the device's motion.
Device orientation events are events that allow you to detect a device's physical orientation, as well as allowing you to detect the device's motion.
Mobile devices commonly have sensors such as gyroscopes, compasses, and accelerometers that can enable applications running on the device to detect the device's orientation and motion.
The device orientation events enable you to write web applications that can change their behavior based on the orientation of the user's device, and that can react when the user moves their device.
Some typical features for which you might want to use the device orientation events include:
Note: This API is widely supported on mobile browsers. While some desktop-only browsers may have limitations due to hardware differences, these constraints are rarely significant given the API's primary usage on sensor-equipped devices.
DeviceOrientationEvent
Represents changes in the physical orientation of a device.
DeviceMotionEvent
Represents changes in the acceleration of a device, as well as the rotation rate.
DeviceMotionEventAcceleration
Represents the amount of acceleration the device is experiencing along all three axes
DeviceMotionEventRotationRate
Represents the rate at which the device is rotating around all three axes.
deviceorientation
Fired when fresh data is available from the device about the current orientation of the device as compared to the Earth coordinate frame.
devicemotion
Fired at a regular interval to indicate the amount of physical force of acceleration the device is receiving at that time, and the rate of rotation of the device.
deviceorientationabsolute
Fired when absolute device orientation changes.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
Device_orientation_events |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
alpha |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
beta |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
gamma |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
Device_orientation_events |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
x |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
y |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
z |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
DeviceMotionEvent |
59 | 14 | 29 | No | 46 | No | 59 | 59 | 29 | 43 | No | 7.0 |
Device_orientation_events |
31 | 12 | 6 | 11 | 18 | 17 | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
acceleration |
31 | 12 | 6 | 11 | 18 | 17 | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
accelerationIncludingGravity |
31 | 12 | 6 | 11 | 18 | 17 | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
interval |
31 | 12 | 6 | 11 | 18 | 17 | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
requestPermission_static |
No | No | No | No | No | No | No | No | No | No | 14.5 | No |
rotationRate |
31 | 12 | 6 | 11 | 18 | 17 | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
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 |
Device_orientation_events |
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 |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
Device_orientation_events |
50 | 79 | No | No | 37 | No | 50 | 50 | No | 37 | No | 5.0 |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
Device_orientation_events |
31 | 12 | 6 | 11 | 18 | No | 4.4.3 | 31 | 6 | 18 | 4.2 | 2.0 |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
Device_orientation_events |
7 | 12 | 63.6–6 | 11 | 12 | No | 3 | 18 | 64–6 | 12 | 4.2 | 1.0 |
BCD tables only load in the browser
BCD tables only load in the browser
BCD tables only load in the browser
BCD tables only load in the browser
BCD tables only load in the browser
BCD tables only load in the browser
BCD tables only load in the browser
© 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/Device_orientation_events