DeviceOrientationEvent

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.

* Some parts of this feature may have varying levels of support.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

DeviceOrientationEvent 提供给网页开发者当设备(指手机,平板等移动设备)在浏览页面时物理旋转的信息。

警告: 当前,火狐浏览器和谷歌浏览器并未能用同一种方式实现,在使用请注意。(见后文)

属性

DeviceOrientationEvent.absolute 只读

用来说明设备是提供的旋转数据是否是绝对定位的布尔值。

DeviceOrientationEvent.alpha 只读

一个表示设备绕 z 轴旋转的角度(范围在 0-360 之间)的数字

DeviceOrientationEvent.beta 只读

一个表示设备绕 x 轴旋转(范围在-180 到 180 之间)的数字,从前到后的方向为正方向。

DeviceOrientationEvent.gamma 只读

一个表示设备绕 y 轴旋转(范围在-90 到 90 之间)的数字,从左向右为正方向。

例子

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

规范

Specification
Device Orientation and Motion
# deviceorientation

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
DeviceOrientationEvent
DeviceOrientationEvent() constructor
absolute
alpha
beta
gamma
requestPermission() static method
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.

参见