Twitter Bootstrap 2.1 affix-plugin无法正常运行

Question

作为标题......我正在使用带有附件的Bootstrap 2.1作为侧边栏。但是当我向下滚动时，另一列突然移动到我的侧边栏下面，如下所示：

之前滚动：

滚动后：

这是我的代码：

    <section class="container">
      <article>
        <div class="row">
          <aside class="sidebar span3" data-offset-top="150" data-spy="affix">
            <ul class="nav nav-list">
              <li><a href="#toc_0">標題1<i class="icon-chevron-right pull-right"></i></a></li>
              <li><a href="#toc_1">標題2<i class="icon-chevron-right pull-right"></i></a></li>
              <li><a href="#toc_2">標題3<i class="icon-chevron-right pull-right"></i></a></li>
              <li><a href="#toc_3">標題4<i class="icon-chevron-right pull-right"></i></a></li>
              <li><a href="#toc_4">標題5<i class="icon-chevron-right pull-right"></i></a></li>
            </ul>
          </aside>
          <div class="span9">

Answer 1

当元素被“加贴”时，元素的CSS变为position: fixed，这就是为什么你会遇到糟糕的浮动问题。在Bootstrap文档页面上，Affix插件始终附加到<ul>元素，而不是.sidebar。

尝试

<aside class="sidebar span3">
  <ul class="nav nav-list" data-spy="affix" data-offset-top="150">
    ...
  </ul>
</aside>

JSFiddle