Javascript 在Jquery中获取页面最大高度

我不知道我是否足够具体

但我创建了一个lightbox样式的fadein背景，但在我看来，背景不会到达页面的最底部。因此，当我滚动时，白色背景再次出现

以下是演示：

HTML

Jquery

$(function() {

function toggle() {
   $('#overlay').toggleClass('backdrop');
   }

 $('[data-toggle="active"]').click(toggle);

 });

---

谢谢你的建议

将覆盖的高度设置为文档的高度：

$('#overlay').toggleClass('backdrop').height($(document).height());

将覆盖更改为

#overlay {
position:absolute;
background: #000;
top: 0;
left: 0;
bottom: 0;
right: 0;

opacity:0;
transition: opacity .3s;
-moz-transition: opacity .3s;
-webkit-transition: opacity .3s;
}

---

如果这不起作用-尝试将底部和右侧的值更改为100%

以获得整个页面的高度：pageHeight=$document.height；46k；你应该知道不要只发布代码答案。请给你的代码添加解释。太棒了！对于像我这样的初学者来说，用正确的代码来解决这个问题非常简单，但是非常困难！

$('#overlay').toggleClass('backdrop').height($(document).height());

$(function() {

  function toggle() {
    var pageHeight = $('html, body').innerHeight();
    $('#overlay').toggleClass('backdrop').height( pageHeight  ); 
  }

  $('[data-toggle="active"]').click(toggle);

});

#overlay {
position:absolute;
background: #000;
top: 0;
left: 0;
bottom: 0;
right: 0;

opacity:0;
transition: opacity .3s;
-moz-transition: opacity .3s;
-webkit-transition: opacity .3s;
}