javascript - 页脚总是固定在页面 Bootstrap 的底部？

Question

我正在尝试创建固定在页面底部的页脚，它只会在我向下滚动到底部时显示。我想那样做，因为现在是最重要的。我添加了一个加载页面，页脚在该页面上可见。

那么如何使页脚始终位于页面底部。我接受关于如何在加载页面打开时隐藏它的任何其他建议。

这是页脚的代码:

<nav class="navbar navbar-default navbar-bottom" role="navigation">
  <div class="container">
    <h1>Hello World</h1>
  </div>
</nav>

提前致谢!

Answer 1

HTML

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

CSS

#footer {
    position:fixed;
    background-color:#000;
    left:0px;
    bottom:0px;
    height:100px;
    width:100%;
    display:none;
}

JS

$(window).scroll(function() {
    if ($(this).scrollTop() < 100) {
        $("#footer").hide();
    }
    else {
        $("#footer").show();
    }
});

Demo here