javascript - 确定浏览器中的实际查看大小

Question

我正在尝试确定当前浏览器窗口的实际 viewPORT 大小。我试过了：

全部返回整个页面大小，而不是查看区域。

我最终要实现的是强制弹出菜单出现在屏幕上（在视口中）。现在，当它显示时，它可能会显示在滚动条下方，而用户对此并不满意。我知道他们点击的位置的 x,y。我只需要将它与查看区域的大小（与弹出窗口的大小）进行比较，看看它是否会离开屏幕。

应该注意的是，页面显示在 IFRAME 中，所以如果我需要上一级以获得正确的值，我可以这样做。

score 2 · Accepted Answer

window.innerHeight/innerWidth

这无疑会为您提供视口大小（在本例中为 iframe 内的大小），但它在 IE 上不可用。

document.documentElement.clientHeight/clientWidth

当浏览器处于标准模式时，这会为您提供视口大小。通常用作 IE 的后备。

document.body.clientHeight/clientWidth

这为您提供了Quirks 模式下的视口高度。您不想处于 Quirks 模式。检查<!DOCTYPE您的文档。

我只需要将其与观看区域的大小进行比较

然后，您还必须查看document.documentElement.scrollTop/ scrollLeft。

score 0 · Accepted Answer

尝试

document.getElementById("").offsetWidth

用不同的元素 ID 填充上面的代码，尝试使用 body 标记或包装 div。

score 0 · Accepted Answer

0

显然，通过转到父文档，我能够获得正确的值。

谢谢！

于 2010-06-24T18:14:41.347 回答

3 回答 3