取消推荐:窗口:方位更改事件

Question

取向变化事件已被废弃。

window.addEventListener("orientationchange", function(event) {
  console.log(event.target.screen.orientation.angle);
});

窗口:定向更改事件

不再推荐这个特性不再被推荐。虽然有些浏览器可能仍然支持它，但它可能已经从相关的web标准中删除，可能正在被删除，或者可能仅为兼容性目的而保留。避免使用它，并在可能的情况下更新现有代码；请参阅本页底部的兼容性表，以指导您的决策。请注意，此功能可能在任何时候停止工作。

我现在能用什么？有什么别的办法吗？

Answer 1

我们可以使用实验特性ScreenOrientation

screen.orientation.addEventListener('change', function(e) { ... })
screen.orientation.onchange = function(e) { ... }

您可以检查屏幕定向表的可用值以确定方向类型：

• 肖像-初级
• 肖像画-二级
• 景观-初级
• 景观-二级

下面是一个例子：

screen.orientation.addEventListener('change', function(e) {
  if (e.currentTarget.type === 'landscape-primary') {
    // landscape mode => angle 0
  } else if (e.currentTarget.type === 'portrait-primary') {
    // portrait mode => angle 0
  }
})

检查浏览器兼容性表。

Answer 2

window.orientation

似乎还能用。我想你可以用

window.addEventListener('resize', function(e) {
  if (Math.abs(window.orientation) == 90) {
    // landscape mode => angle 90 or -90
  } else if (window.orientation == 0) {
    // portrait mode => angle 0
  }
})

如果你的目标是严格机动的