不正确的 window.innerWidth 和 window.innerHeight

Posted

技术标签:

【中文标题】不正确的 window.innerWidth 和 window.innerHeight【英文标题】:incorrect window.innerWidth and window.innerHeight 【发布时间】:2014-04-22 17:58:48 【问题描述】:

我遇到了一个我很难描述的奇怪错误...

我正在开发一个 html5 Canvas 应用程序,当它从我的localhost 服务器提供服务时,它开始出现奇怪的行为。我发现 window.innerWidthwindow.innerHeight 在 Firefox 和 Chrome 中突然被错误地报告。在这台机器上,innerWidth 应该是 1366,但在 Firefox 中报告为 1525,在 Chrome 中报告为 2048。

我认为这可能是我的 javascript 中的一个奇怪故障,但我发现这现在影响了从 localhost 查看的所有页面,并且在一些较旧的应用程序中弄乱了 css。

奇怪的是,从127.0.0.1 查看时,一切正常。我们还发现,当我的老板从公共 Dropbox 文件夹中查看应用程序并在他的计算机上使用 Firefox(Chrome 工作正常)查看应用程序时,也会发生同样的问题。但是,在该计算机上本地提供没有问题。

这个让我彻底懵了。我希望有人知道可能的原因或追踪问题的方法,因为我们不能让使用该应用的客户发生这种情况。

编辑:更多数字

window.innerWidth: 2048
window.outerWidth: 1366
screen.width: 1366
window.screen.availWidth: 1366

innerWidth 是唯一错误的,它与页面内容无关,因为即使打开空白文件,这些值也保持不变。

【问题讨论】:

还有一篇文章讨论了这两项检查。警报(window.screen.availWidth);警报(window.screen.availHeight); ***.com/questions/3437786/… 设置一些增量中断并针对您的宽度和高度变量运行两项检查可能会有所帮助。 谢谢弗兰克,很高兴检查,但不幸的是我无法从中收集到太多信息。 我有同样的问题,127.0.0.1 工作虽然...很奇怪。谢谢。 5 年零 7 个月后.. 我对 localhost 也有同样的问题 【参考方案1】:

你可以使用下面的代码

var screen = width:$(window).width(), height:$(window).height();  

【讨论】:

op 没有将其标记为 jQuery。 是的,没有 jQuery,但还是试了一下 - $(window).width() 给出了相同的错误尺寸。 如果没有足够的声誉,他应该如何在他们的帖子下方发表评论?

以上是关于不正确的 window.innerWidth 和 window.innerHeight的主要内容,如果未能解决你的问题,请参考以下文章

当我提到宽度为 window.innerwidth 和高度为 window.innerheight 时,为啥我会溢出

window.innerWidth 实时

WKWebView 的调整大小处理程序中未更新 window.innerWidth/Height

如何让 CSS 媒体查询与 jQuery $(window).innerWidth() 一起使用?

ng-class $window.innerWidth

使用$(window).width(),window.outerWidth,window.innerWidth,document.documentElement.clientWidth,documen