使用jQuery的页面高度

测量整个页面（而不仅仅是屏幕）高度的最佳方法是什么。我问这个问题的原因是因为我需要添加一个覆盖它的覆盖div。也许我可以测量高度，并添加一些像素，以便更好地测量

如果我这样做，是不是朝着正确的方向走了一步，还有更好的方法吗

$('#myOverlay').height($('#myPage').height() + 100) ;

---

覆盖的CSS/HTML方法

如果您希望覆盖另一个元素或视口，则只需使用CSS/HTML即可实现，这将更快，并且也适用于禁用JavaScript的浏览器

CSS示例

通过使用绝对位置，我们可以告诉浏览器使用覆盖元素填充整个容器，只要容器元素处于相对位置：

#myPage {
    position: relative;
}

#myOverlay {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1000;
}

#myOverlay.fixed {
    position: fixed;
}

HTML示例

要使用覆盖覆盖覆盖#myPage元素（请参见上的），请执行以下操作：

获取整个文档的JavaScript方法

要获取文档的整个高度（甚至是视口之外的高度），您可以使用非常简单且适用于所有浏览器的：

$.getDocHeight = function(){
    return Math.max(
        $(document).height(),
        $(window).height(),
        /* For opera: */
        document.documentElement.clientHeight
    );
};

您可以尝试使用：

$(document).height();

---

没有时间测试它，但要检查它。

如果你考虑使用固定的定位覆盖，而不是绝对的，你就不需要屏幕的高度，但是它会一直覆盖它。请在此处尝试：

---

所以你真正想要的是视口的高度？而且：）设置宽度和高度是多余的，或者你这样做的原因是什么？是的，你是对的。这可能根本没有必要。老实说，我不记得原因是什么了。可能是与浏览器相关的修复，我假设是遗留IE（如果有的话），或者我可能太彻底了毕竟。人越多越有意思

$.getDocHeight = function(){
    return Math.max(
        $(document).height(),
        $(window).height(),
        /* For opera: */
        document.documentElement.clientHeight
    );
};

$(document).height();

.overlay
{
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background-color: #909090;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}