Our volunteers haven't translated this article into 한국어 yet. Join us and help get the job done!
You can also read the article in English (US).

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The DeviceOrientationEvent provides web developers with information from the physical orientation of the device running the web page.

Warning: Currently, Firefox and Chrome do not handle the coordinates the same way. Take care about this while using them.

Constructor

DeviceOrientationEvent.DeviceOrientation()
Creates a new DeviceOrientationEvent.

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 to 360.
DeviceOrientationEvent.beta Read only
A number representing the motion of the device around the x axis, express in degrees with values ranging from -180 to 180. 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 to 90. This represents a left to right motion of the device.
DeviceOrientationEvent.webkitCompassHeading 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 Read only
The accuracy of the compass means that the deviation is positive or negative. It's usually 10.

Example

window.addEventListener('deviceorientation', function(event) {
  console.log(event.alpha + ' : ' + event.beta + ' : ' + event.gamma);
});

Specifications

Specification Status Comment
Device Orientation Events Working Draft Initial specification.

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

  
Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 7.0 [1] (Yes) 6 [2] ? ? ?
Constructor 59 ? ? ? ? ?
  
Feature Android Webview Chrome for Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Yes) [1] (Yes) [1] (Yes) 6 [2] No support No support 4.2
Constructor 59 59 ? ? ? ? ?

[1] Before version 50, Chrome provided absolute values instead of relative values for this event. Developers still needing absolute values may use the ondeviceorientationabsolute event.

[2] Firefox 3.6, 4, and 5 supported mozOrientation instead of the standard DeviceOrientationEvent interface

See also

문서 태그 및 공헌자

 최종 변경: Mrluobo,