我怎么知道我的内容是否垂直占据了整个页面?

How do I know if my content takes up the whole page vertically?

本文关键字：我的 是否 垂直 我怎么知道      更新时间：2023-09-26

我有一个网站，我在过去的几个星期一直在工作。我有一个非常漂亮的页脚，问题是，它没有留在底部。我想到了一个简单的解决办法。

如果页面没有完全填满(即内容只有一半)，则将页脚绝对放置在底部。

如果页面溢出(垂直)，让页脚作为另一个元素。

问题是，我不知道如何检查我的内容是否填充过多。有没有办法检查文档是否垂直地填满了所有的空格?我唯一能想到的就是检查垂直滚动条是否启用，但是，我也不知道如何检查。

我正在使用jQuery，答案与它是好的。谢谢!

编辑

好吧，我的问题显然被误解了。对不起，伙计们，我不需要解决如何保持我的脚在底部。我需要确定数据是否在y轴上溢出的方法。我碰巧提到了我需要知道这些的原因。:p

我已经成功使用过很多次了:http://cssstickyfooter.com。

使用jQuery, $(window).height()是如何获得视口的高度。您可以根据内容的高度检查此值:

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

像Matt发布的那样使用粘贴页脚技术。

它的基本思想是为页脚设置一个静态高度。让你的网页占据整个浏览器的高度。将页脚从#contentdiv中移出屏幕，然后将页脚移回具有负边距值的页面。

不查看HTML很难回答这个问题，但是如果您使用jquery，只需使用outerHeight来获取页面上元素的垂直尺寸，并将其与window.height

进行比较

您可以应用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>

这有助于防止内容溢出，并且应该将页脚放在内容的底部或下方。

相关文章：