如何知道我的內容是否佔用整個頁面？

我有一個網站，我一直在過去幾個星期工作。我有一個很好的頁腳，問題是，它不會停留在底部。我想出了一個簡單的解決方案。如何知道我的內容是否佔用整個頁面？

如果頁面沒有被完全填充（即內容只是下降一半），則將頁腳絕對定位到底部。

如果頁面溢出（垂直），則將頁腳留作另一個元素。

問題是，我不知道如何檢查我的內容是否過滿。有沒有辦法檢查文檔是否填滿了所有的空間？我唯一能想到的是檢查垂直滾動條是否啓用，但是，我不知道如何檢查。

我使用jQuery，它的答案很好。謝謝！

編輯

OK，我的問題顯然是誤解了。對不起，我不需要解決如何讓我的頁腳底部。我需要確定數據是否在Y軸上溢出的方法。我碰巧提到了我爲什麼需要知道這一點的原因。不要讓我後悔這個傢伙：p

來源

2011-10-04 FreeSnow

http://stackoverflow.com/questions/4814398/jquery-check-if-scrollbar-visible-div-with-overflowauto –

使用jQuery，$(window).height()是怎麼你得到視口的高度。您可以根據您的內容高度檢查此值：

if($("#content").height() > $(window).height()) { 
    // absolute position my footer 
}

來源

2011-10-04 21:44:26 alecananian

我已經用這個成功了很多次：http://cssstickyfooter.com。根本不需要JavaScript。

來源

2011-10-04 21:39:27

問題是，我的頁腳將是一個可變的高度取決於一些不同的事情。我寧願讓它動態完成。 – FreeSnow

使用像Matt貼的粘滯頁腳技術。

它的基本思想是爲頁腳設置一個靜態高度。讓您的網頁佔據瀏覽器的整個高度。將頁腳從#content div推出屏幕，然後將頁腳移回到具有負邊距值的頁面上。

來源

2011-10-04 21:44:01

問題是，就像我告訴馬特，我的頁腳不能是一個靜態的高度。 – FreeSnow

你可以使用相同的技術。只需提供jQuery的CSS值。使用'$（'＃footer'）。height（）;' –

很難沒有看到你的HTML回答，但如果你使用jQuery只是用outerHeight讓你的頁面上的元素的垂直尺寸，並把它比作window.height

來源

2011-10-04 21:44:15 Porco

您可以應用css clearfix技巧。如前所述，查看代碼非常困難。即使這樣也可以。

例子：

<html> 
    <style> 
    .clearfix:after { 
     content: "."; 
     display: block; 
     height: 0; 
     clear: both; 
     visibility: hidden; 
    } 
    </style> 

<body> 

    <div id="content" class="clearfix"> 
    </div> 

    <div id="footer"> 
    </div> 

</body> 
</html>

這有助於保持內容溢出，並應保持你的頁腳底部或低於您的內容。

來源

2011-10-04 21:49:12 Nicole

如何知道我的內容是否佔用整個頁面？

回答

相關問題