deviceorientation

Baseline 2023
Newly available

Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Событие deviceorientation срабатывает, когда с сенсоров ориентации поступают новые данные о текущем положении устройства внутри Земной системы координат. Эти данные собираются с помощью магнитометра устройства. Более детальное объяснение дано в Ориентация и объяснение данных движения.

Общая информация

Спецификация

Событие DeviceOrientation

Определение

DeviceOrientationEvent

Всплывает

Нет

Отменяемо

Нет

Целевой элемент

По умолчанию (window)

Действие по умолчанию

Нет

Свойства

Property Type Description
target Только для чтения EventTarget The event target (the topmost target in the DOM tree).
type Только для чтения DOMString The type of event.
bubbles Только для чтения Boolean Whether the event normally bubbles or not
cancelable Только для чтения Boolean Whether the event is cancellable or not?
alpha Только для чтения double (float) The current orientation of the device around the Z axis; that is, how far the device is rotated around a line perpendicular to the device.
beta Только для чтения double (float) The current orientation of the device around the X axis; that is, how far the device is tipped forward or backward.
gamma Только для чтения double (float) The current orientation of the device around the Y axis; that is, how far the device is turned left or right.
absolute Только для чтения boolean This value is true if the orientation is provided as a difference between the device coordinate frame and the Earth coordinate frame; if the device can't detect the Earth coordinate frame, this value is false.

Пример

js
if (window.DeviceOrientationEvent) {
  window.addEventListener(
    "deviceorientation",
    function (event) {
      // alpha: rotation around z-axis
      var rotateDegrees = event.alpha;
      // gamma: left to right
      var leftToRight = event.gamma;
      // beta: front back motion
      var frontToBack = event.beta;

      handleOrientationEvent(frontToBack, leftToRight, rotateDegrees);
    },
    true,
  );
}

var handleOrientationEvent = function (
  frontToBack,
  leftToRight,
  rotateDegrees,
) {
  // Сделайте что-нибудь необычное здесь
};

Совместимость с браузерами

Похожие события

Смотрите также