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

标签 javascript jquery html css twitter-bootstrap

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

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

这是页脚的代码:

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

提前致谢!

最佳答案

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

关于javascript - 页脚总是固定在页面 Bootstrap 的底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31784683/

相关文章:

javascript - AngularJS 和艰难的开端 - 简单的应用程序不起作用

从毫秒到小时-分钟-秒的javascript倒计时脚本

python - 解析 HTML 时如何处理重定向? - Python

java - 使用 html 更改 XML 值

多个字段的javascript字段计算

javascript - 如何使用 Snap.svg 对加载的 SVG 内的路径变形进行动画处理?

javascript - JavaScript 的 MAC 地址正则表达式

javascript - jQuery Datatables 根据条件更改列的值

jQuery typeahead.js 和重音符号

javascript - 必须使用 JS/JQ (?) 触发 PHP Formdata