获取Chrome浏览器高度或导航/菜单/工具栏高度

时间:2017-05-24 20:35:07

标签: javascript jquery

我们如何获得Chrome浏览器窗口的实际浏览器高度?在我的测试中,如果浏览器没有使用可用的全高度,我很难用Javascript计算它的实际高度。

出于我的示例的目的,我的浏览器窗口的高度为1033px。 Chrome浏览器窗口底部与Windows工具栏分开7px。

我无法找到一种从Javascript计算1033px实际高度的方法。如果我知道导航/菜单/工具栏高度(在我的示例中为109px),我可以计算出高度。

 1040px (screen.availHeight)
- 109px (Nav/Menu Toolbars Height)
-   1px (bottom border)
- 923px (window.innerHeight)
-------
    7px (Height Pixels not used by Browser)

1040px - 7px = 1033px (Browser Actual Height)

Nav/Menu/Toolbars Height: 109px
Browser Height: 1033px
Windows Toolbar: 40px

Values from Javascript:
Screen Size: 1080px
screen.height = 1080
screen.availHeight = 1040
window.outerHeight = 1040
window.innerHeight = 923
$(window).height() = 923

是否有任何Javascript方法可以获取导航菜单的高度或Chrome浏览器窗口的实际高度?

下面是我想要计算的示例图像。 enter image description here

1 个答案:

答案 0 :(得分:1)

window.outerHeight是整个Chrome窗口的大小。如果您想知道Chrome的Chrome占用了多少空间,可以从window.innerHeight

中减去window.outerHeight