javascript - jQuery 将页脚贴在页面底部

Question

我花了很长时间尝试使用 CSS 将页脚固定在页面底部，但几乎放弃了。

如果视口(viewport)的高度小于 HTML 文档的高度，我想要的是不为页脚分配额外的 CSS 属性。

如果文档高度小于窗口高度，我希望将以下 CSS 分配给 div#thefooter:

position: fixed;
bottom: 0px;
margin-left: -5px;

这是我的 JS 代码。它什么都不做，控制台日志什么也不显示。

$(document).ready(function(){

  $(window).bind("load", function(){ putFooter(); });
  $(window).resize(function(){ putFooter(); });

  function putFooter(){
    var wh = $(window).height();
    var dh = $(document).height();
    if(dh < wh) {
      $("#thefooter").css({"position": "fixed", "bottom": "0px", "margin-left": "-5px"});
      }
    }

});

编辑:这是我的 HTML 的样子:

<div id="allexceptfooter">
  <div id="themenu">...</div>
  <div id="actualcontent">...</div>
</div>
<div id="thefooter">...</div>

如果您想查看全部内容，我的网站是 duncannz .com

Answer 1

检查一下，根本不需要 javascript...

http://www.cssstickyfooter.com