Android浏览器的screen.width,screen.height&window.innerWidth&window.innerHeight不可靠

Question

我正在开发一个针对台式机,平板电脑和智能手机浏览器的网络应用.

Web应用程序具有使用实施灯箱彩盒用iframe.当调整浏览器窗口的大小或平板电脑/手机的方向发生变化时,Javascript代码会查询窗口尺寸,以便调整灯箱的某些元素.

我遇到的问题是桌面上的一切正常(Windows:IE,Firefox,Chrome,Mac:Safari),iPad和iPhone,但Android智能手机(HTC)和Android模拟器上没有.

对于Android的始终返回不同的值screen.width,screen.height,window.innerWidth和window.innerHeight当他们从窗口的resize事件,触发多次内部查询.

为什么Android浏览器会返回如此大的值差异,如何可靠地检测浏览器窗口的宽度和高度？

Answer 1

six*_*ix8 16

在Android上,window.outerWidth和window.outerHeight可靠地是屏幕大小.根据您的Android版本,innerWidth/Height通常不正确.

这是关于这种情况的非常好的写作.

Answer 2

我花了几个小时才找到解决方法。

window.innerHeight、window.outerheight等中唯一不变的是screen.height。

这段代码给了我外部高度：

screen.height / window.devicePixelRatio - window.screenTop

另外，为了支持旧版本的 android，请将代码放在setTimeout

我希望这有帮助 =)