jquery $（window）.height（）和$（document）.height（）返回相同的

我需要我的背景图像低于我的菜单div。因此，不是将背景应用到body元素，而是将其放入另一个包含我的body div的bg div中，并将宽度设置为100％（我的body div具有指定的宽度）。我在bg div中设置背景。

我测试了它，因为文档不够长，我得到了一半的背景图片。所以我试图为此做一个JavaScript修复。

<!DOCTYPE HTML> 
..... 
<script type="text/javascript" src="jquery-min.js"></script> 
<script type="text/javascript"> 
function setDocumentSize() { 
    alert($(window).height()); 
    alert($(document).height()); 
    if ($(window).height()>$(document).height()) { 
     var height = $(window).height()-$(document).height(); 
     document.getElementById('bg').style.height=height+"px" 
     } 
    } 
..... 
</script> 
..... 
<body onload="setDocumentSize()"> 
<div class="menu"> 
..... 
</div> 
<div class="bg"> 
    <div class="body"> 
    .....(background in this div) 
    </div> 
</div>

现在两个警报都会弹出视口高度。因此没有任何反应

我使用的是Firefox 16.0.2

这里是一个实际的页面http://servapps.dyndns-work.com/abstract/

来源

2013-04-29 serv92

当你的文档没有超出窗口（没有滚动条）他们显示相同。当你最小化你的窗口到点滚动条弹出并刷新你的页面，你可能会得到线索.. :-) – Daniel 2013-04-29 05:51:40

为什么不只是使用最小高度的图像高度的背景div？ – VictorKilo 2013-04-29 05:51:55

这一个环节可以用CSS来实现。您需要确保所有包含的元素至少是页面的高度（height: 100%）。这包括html和body元素。

此代码应与网站合作：

html, body, #bg { 
    height: 100%; 
}

来源

2013-04-29 06:02:23

还有一个原因，这可能会失败是DOCTYPE声明（<!DOCTYPE html>）丢失时。添加此项可修复$(window).height()以返回正确的视口高度。

来源

2013-11-25 07:37:00 Thava

谢谢！我真的疯了！我不知道为什么这样？有人有线索吗？ – 2015-01-08 19:50:41

jquery $（window）.height（）和$（document）.height（）返回相同的

回答

相关问题