使用jquery在移动浏览器中检索屏幕的视口高度

我试图在移动浏览器中获取视口高度，而没有浏览器栏的高度，但我试过的所有解决方案都已缩短。使用jquery在移动浏览器中检索屏幕的视口高度

其他人建议使用下面的内容，但它不适用于我。滚动

var screenHeight = window.innerHeight; 
$('.mobile-nav-wrapper').height(screenHeight)

'window.innerHeight'将不考虑滚动高度...... – Rayon

应该不会出现滚动可言，假设innerHeight是给我正确的视口的高度减去浏览器栏。那是我的问题。 – excessive34

你设置了'* {padding：0; margin：0;}'？ – Rayon

解决方案1时，我仍然可以在窗口底部的空白栏：

我没有使用jQuery的答案。但使用普通/香草JavaScript不会导致任何问题:)。以下脚本允许您可靠地检测视口大小（高度和宽度）。

使用范例：

<script type="text/javascript"> 
    var width = viewportSize.getWidth(); 
    var height = viewportSize.getHeight(); 
</script>

我曾在几个项目中使用它，是我必须重新初始化基于当前的视口宽/高一些小部件，而不是使用窗宽/高度（窗口宽度/高度计算在所有浏览器中都不一致 - 其中一些包括作为窗口宽度的一部分的滚动条大小16px，另一些不包括）。

解决方案2：（仅供参考 - 不回答OP的问题，但是，所以我认为它可以保持它关系）

好Modernizr的有一个非常好的新增Modernizr.Mq。通过它你可以根据身高

Modernizr.mq交叉检查其打破你在点范围...

if(Modernizr.mq("(min-width:320px)")){ 
//Do job 1 
} 
else if (Modernizr.mq("(min-width:768px)")){ 
//Do job 2 
}

或（ “（最小高度：800像素）”）

2016-07-29 18:52:42

这是OP在这种情况下想要的:)。任何我输入详细答案的方式 –

我相信你正在寻找的是scrollHeight属性

的scrol lHeight属性返回像素中元素的整个高度，包括填充，但不包括边框，滚动条或边距。

你可以试试这个：

document.body.scrollHeight

2016-07-29 19:21:04

回答