在滚动div后,如何将引导导航栏固定到顶部？

Question

我试图让带有引导程序的导航栏出现在某个div之后,称为"A".Div"a"位于页面顶部,高度约为400px.一旦用户滚过div"a"和滚动条,我希望滚动条粘在顶部.类似于这样的事情:https://www.facebook.com/home但我顶部没有视频,它是一个图像.

我们可以自己引导吗？

谢谢!

Answer 1

如果您想使用Twitter的Bootstrap来实现这一点,请查看'Affix'js.您可以使用"data-offset-top"定义"固定"点,然后当用户向下滚动时,导航栏将固定在顶部.

CSS:

#con .well {
    height:390px;
}

#nav.affix {
    position: fixed;
    top: 0;
    width: 100%
}

HTML:

<div class="container" data-spy="affix" data-offset-top="400" id="nav">
    <div id="nav" class="navbar">
        <div class="navbar-inner"> ...

使用Javascript:

$('#nav').affix();

这是工作小提琴:http: //jsfiddle.net/skelly/df8tb/

这是一个工作示例(针对Bootstrap 3更新):http://bootply.com/90936

Answer 2

这个答案不再正确。请参阅下面@zim 的回答。