twitter-bootstrap - Twitter Bootstrap 词缀 : Can't pin

Question

我正在使用最新版本的 Twitter Bootstrap 并尝试在我网站上的 div 上实现 Affix:

<div id="sectiontwo" class="affix-top" data-spy="affix" data-offset-top="1000">
<div class="row sectiontwo">
<div class="span4">
<hr>
<h4>Join Headline/h4>
<hr>
</div>
</div>
</div><!--#sectiontwo-->

但我收到了奇怪的行为:

• 在 Chrome 中:
  我无法“固定”它。相反，当我滚动时，它会滚动页面。

• 在火狐浏览器中:
  我也无法“固定”它，但当它滚动时，它会跳跃并固定在底部。

我想要它做的是一旦触发附加部分就将自己固定到窗口顶部。据我了解，这就是它在 Twitter Bootstrap 文档网站上的工作原理。

Answer 1

首先，data-offset-top="1000" 是在附加插件启动之前用户需要滚动的距离(以像素为单位)。

在您的情况下，用户需要滚动 1000px，然后 Affix 插件才会更改您的 div 的显示。

其次，我相信 Affix 插件会将您的 div 的类(滚动 1000px 后)从 .affix-top 更改为 .affix

由于 bootstrap 已经将类 .affix 设置为 position:fixed，因此您需要做的就是在 css 中添加定位，例如顶部:40px;