Javascript 在Android方向更改时调整HTML元素的大小

我正在尝试将Javascript中的事件绑定到Android中的orientationchange或resize事件，以便更改web应用程序中某些元素的宽度/高度。在这种情况下，我使用window.innerHeight和window.innerWidth获取窗口的当前高度和宽度

---

这在iOS和桌面设备上非常有效，但在Android上，它似乎在更改窗口变量中的值之前调用此事件。因此，当有人从纵向切换到横向时，我仍然会得到纵向的值，因此无法正确调整大小。有人知道问题是什么吗？我如何解决它？

有CSS选择器用于此：

/*normal styles here */
#wrap {
   width:1024px;
}
@media only screen and (orientation:portrait){
   /* portrait styles here */
   #wrap {
      width:768px;
   }
}

---

来源：

我已经解决了这个问题。结果表明，resize事件可以正常工作，但orientationchange事件不能正常工作。我正在测试是否存在orientationevent，如果可能的话，然后绑定到它。我已经将代码改为只使用resize事件，并达到了预期的效果

---

我不确定这是否是我的代码所独有的，但这正是我修复它的原因。

我可以确认，在android 2.2和2.3中，“OrientionChange”-事件并没有像预期的那样工作。它说，当你检查可用性时，它会出现，但不会触发。不过，它可以在安卓1.6和2.1中运行。最后，我和您一样，对所有Android版本都使用了“调整大小”事件。

我的调查显示，当您修改web视图的默认用户代理时，存在此Android webview错误（“OrientionChange”在更改窗口之前触发20-150毫秒。innerHeight Javascript值）。不过，别问我一个人和另一个人有什么关系

但要解决您的问题，您可以执行以下操作之一：

1） 从代码中删除以下useragent修改

webView.getSettings（）.setUserAgentString（“自定义用户代理”）

---

2） 使用“调整大小”事件而不是“方向更改”事件查看问题和答案。它覆盖了一个跨平台以检测方向的变化。

---

要获得视口和/或跨平台窗口的大小，请查看或。

不确定它们是否适用于Android，如果不适用于Android haz bad browzer。我无法使用媒体查询，因为高度和宽度取决于屏幕大小，必须进行计算。Android上有许多不同的屏幕尺寸。