ScreenOrientation

基线 2023

全新可用

2023 年 3 月起,此功能在最新的设备和浏览器版本中都能使用。此功能可能无法在较旧的设备或浏览器中使用。

ScreenOrientation 接口 屏幕方向 API 提供有关文档当前方向的信息。

可以使用 screen.orientation 属性检索 ScreenOrientation 实例对象。

EventTarget ScreenOrientation

实例属性

ScreenOrientation.type 只读

返回文档的当前方向类型,可以是 portrait-primaryportrait-secondarylandscape-primarylandscape-secondary 之一。

ScreenOrientation.angle 只读

返回文档的当前方向角。

实例方法

ScreenOrientation.lock()

将包含文档的方向锁定为其默认方向,并返回一个 Promise

ScreenOrientation.unlock()

将包含文档的方向解锁,使其不再锁定为默认方向。

事件

使用 addEventListener() 或通过将事件侦听器分配给此接口的 oneventname 属性来监听这些事件。

change

每当屏幕方向发生变化时触发。

示例

在以下示例中,我们监听方向 change 事件并记录新的 屏幕方向类型角度

js
screen.orientation.addEventListener("change", (event) => {
  const type = event.target.type;
  const angle = event.target.angle;
  console.log(`ScreenOrientation change: ${type}, ${angle} degrees.`);
});

规范

规范
屏幕方向
# screenorientation-interface

浏览器兼容性

BCD 表格仅在浏览器中加载