События ориентации устройства
Безопасный контекст: Эта функция доступна только в безопасных контекстах (HTTPS), в некоторых или во всех поддерживающих браузерах.
События ориентации устройства — это события, которые позволяют вам обнаружить физическую ориентацию устройства, а также обнаружить движение устройства.
Концепции и использование
Мобильные устройства обычно имеют датчики, такие как гироскопы, компасы и акселерометры, которые позволяют приложениям, работающим на устройстве, определять ориентацию и движение устройства.
События ориентации устройства позволяют вам создавать веб-приложения, которые могут изменять свое поведение в зависимости от ориентации устройства пользователя и реагировать на движения устройства.
Некоторые типичные функции, для которых вы можете использовать события ориентации устройства, включают:
-
в веб-играх, чтобы пользователь мог управлять движением персонажей или объектов в игре, наклоняя и перемещая устройство
-
в приложениях для отображения карт, чтобы переориентировать карту на основе положения устройства или предоставить пошаговые инструкции, которые обновляются в соответствии с движениями пользователя
-
для распознавания жестов — например, распознавания жеста «встряхивание» и использования его для выполнения какого-либо действия, такого как очистка области ввода, когда пользователь встряхивает устройство
Примечание: Этот API широко поддерживается мобильными браузерами. Хотя некоторые браузеры, предназначенные только для настольных компьютеров, могут иметь ограничения из-за различий в оборудовании, эти ограничения редко существенны, учитывая основное использование API на оборудовании с датчиками.
Интерфейсы
DeviceMotionEvent-
Представляет изменения ускорения устройства, а также скорость вращения.
DeviceMotionEventAcceleration-
Представляет величину ускорения, испытываемого устройством по всем трем осям.
DeviceMotionEventRotationRate-
Представляет скорость вращения устройства вокруг всех трех осей.
DeviceOrientationEvent-
Представляет изменения физической ориентации устройства.
Расширения для других интерфейсов
-
devicemotionсобытие -
Срабатывает с определенной периодичностью, чтобы указать величину физического ускорения, которое получает устройство в данный момент, и скорость вращения устройства.
-
deviceorientationсобытие -
Срабатывает, когда доступны свежие данные от устройства о текущей ориентации устройства по сравнению с системой координат Земли.
-
deviceorientationabsoluteсобытие -
Срабатывает при изменении абсолютной ориентации устройства.
Спецификации
| Спецификация |
|---|
| Ориентация и движение устройства |
Совместимость с браузерами
| Рабочий стол | Мобильный | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
Device_orientation_events |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
alpha |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
beta |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
gamma |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
| Рабочий стол | Мобильный | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
Device_orientation_events |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
x |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
y |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
z |
31 | 12 | 6 | 18 | Нет | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
| Настольные компьютеры | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
DeviceMotionEvent |
59 | 14 | 29 | 46 | Нет | 59 | 29 | 43 | Нет | 7.0 | 59 |
Device_orientation_events |
31 | 12 | 6 | 18 | 17 | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
acceleration |
31 | 12 | 6 | 18 | 17 | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
accelerationIncludingGravity |
31 | 12 | 6 | 18 | 17 | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
interval |
31 | 12 | 6 | 18 | 17 | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
requestPermission_static |
Нет | Нет | Нет | Нет | Нет | Нет | Нет | Нет | 14.5 | Нет | Нет |
rotationRate |
31 | 12 | 6 | 18 | 17 | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
| Настольные компьютеры | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
DeviceOrientationEvent |
59 | 14 | 17 | 46 | Нет | 59 | 17 | 43 | Нет | 7.0 | 59 |
Device_orientation_events |
7Перед версией 50, Chrome предоставлял абсолютные значения вместо относительных для этого события. Разработчики, которым все ещё нужны абсолютные значения, могут использовать событиеdeviceorientationabsolute. |
12 | 6Firefox 3.6, 4 и 5 поддерживалиmozOrientation вместо стандартного интерфейса DeviceOrientationEvent. |
15 | 17 | 18Перед версией 50, Chrome Android предоставлял абсолютные значения вместо относительных для этого события. Разработчики, которым все ещё нужны абсолютные значения, могут использовать событиеdeviceorientationabsolute. |
6Firefox for Android 4.6, 4 и 5 поддерживалиmozOrientation вместо стандартного интерфейса DeviceOrientationEvent. |
14 | 4.2 | 1.0Перед версией 5.0 Samsung Internet предоставлял абсолютные значения вместо относительных для этого события. Разработчики, которым все ещё нужны абсолютные значения, могут использовать событиеdeviceorientationabsolute. |
3Перед версией 50, Chrome предоставлял абсолютные значения вместо относительных для этого события. Разработчики, которым все ещё нужны абсолютные значения, могут использовать событиеdeviceorientationabsolute. |
absolute |
7 | 12 | 6 | 15 | 17 | 18 | 6 | 14 | Нет | 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 |
Нет | Нет | Нет | Нет | Нет | Нет | Нет | Нет | 14.5 | Нет | Нет |
| Настольные компьютеры | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
Device_orientation_events |
50 | 79 | 110 | 37 | Нет | 50 | 110 | 37 | Нет | 5.0 | 50 |
| Настольные компьютеры | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
Device_orientation_events |
31 | 12 | 6 | 18 | 17 | 31 | 6 | 18 | 4.2 | 2.0 | 4.4.3 |
| Настольные компьютеры | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
Device_orientation_events |
7 | 12 | 63.6–6 | 12 | 17 | 18 | 64–6 | 12 | 4.2 | 1.0 | 3 |
api.Window.deviceorientation_event
Таблицы BCD загружаются только в браузере
api.Window.devicemotion_event
Таблицы BCD загружаются только в браузере
api.Window.deviceorientationabsolute_event
Таблицы BCD загружаются только в браузере
api.DeviceOrientationEvent
Таблицы BCD загружаются только в браузере
api.DeviceMotionEvent
Таблицы BCD загружаются только в браузере
api.DeviceMotionEventAcceleration
Таблицы BCD загружаются только в браузере
END_OF_DOCUMENT_MARKERapi.DeviceMotionEventRotationRate
BCD таблицы загружаются только в браузере
См. также
- Ориентация и движение устройства на web.dev
© 2005–2024 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