Bootstrap Affix - 关于data-offset-bottom的任何教程?

时间:2016-03-29 07:32:44

标签: twitter-bootstrap

我试过在那里寻找那么多的词缀教程,但是他们都讨论了数据偏移顶部。这里的任何人都知道数据偏移底部的教程?
我试过在这里写一些代码 https://jsfiddle.net/okiewardoyo/3m8oeLp5/
在jsfiddle之上的表格,我尝试使用data-offset-top,

json_decode

我想要的是,当用户滚动到页脚apear时,黄色侧栏变得不固定并跟随页脚。
我想,我们可以在这里使用data-offset-bottom。但是怎么做?感谢

1 个答案:

答案 0 :(得分:6)

我认为tutorial from W3School对于您的问题已经足够清楚,还有一些简单的教程here

偏移顶部或底部仅指示哪个部分将“固定”(这是可选信息)。因为你希望它在词缀位于底部时停止位置(类更改为词缀 - 底部) 这个位置应该是绝对的,所以元素不会继续应用词缀(通常问题是没有应用类词缀 - 底部。)

要做到这一点,你可以使用jQuery和词缀功能,就像在两个链接中所说的那样,你必须硬分配这个值(页脚的高度)。 已分配职位

#nav1.affix-bottom { position: absolute; }

导航看起来如何:

`<ul id="nav1" class="nav nav-pills nav-stacked" data-spy="affix" data-offset-top="100" data-offset-bottom="600">`

Your example working(实际上我也是从容器中移动导航,但无论如何都可以工作)