Bootstrap,仅在某个滚动点之后附加

时间:2017-11-06 19:47:34

标签: twitter-bootstrap-3 scroll affix

我正在使用bootstrap和bootstrap-toc(https://afeld.github.io/bootstrap-toc/

使用以下方案:

http://jsbin.com/cerozeleya/edit?output(确保点击“与Js一起运行”才能看到侧边栏)

当我滚动视图时,我希望侧边栏滚动直到不再看到jumbotron的点。此时,它应该在内容滚动时保持固定。

我不能用包含的jsbin来解决这个问题。我试着弄乱导航#toc中的data-offset-top / data-offset-bottom属性,但没有任何改变。我在这里发现另一个问题,指示css上的以下更改:

.affix{ top: 0px;}
.affix-bottom{ position: absolute;}

但这也不起作用。我尝试阅读词缀和scrollspy文档,但它要么不点击我,要么我没有看到我做错了。

任何帮助表示赞赏。谢谢!

1 个答案:

答案 0 :(得分:0)

您必须在要添加的标记中使用数据偏移顶部

data-spy="affix" data-offset-top="197"

例如

<nav id="toc" data-toggle="toc" data-spy="affix" data-offset-top="197"></nav>

根据您的需要编辑偏移值