滚动到页面底部后，引导词缀停止工作

Question

我有固定左侧边栏的长页面：

<div id="sidebar">
    <ul>
        <li>menu 1</li>
        <li>menu 2</li>
        <li>menu 3</li>
        <li>menu 4</li>
        <li>menu 5</li>
        <li>menu 6</li>
        <li>menu 7</li>
    </ul>
</div>

和affix的js：

$("#sidebar").affix({offset: {top: 0, bottom:420} });

我有 height:390px 的页脚。 当我第一次滚动到页面底部并尝试向上滚动时，侧边栏返回到它的第一个位置（到页面顶部），它不再是position:fixed。它采用内联样式position:relative，添加了 Bootstrap JS。当我滚动到顶部时，我看到类更改为affix-top。每隔一个滚动页面位置，类是affix，即使它是页面底部和侧边栏保持position:relative。 如果我只使用：

$("#sidebar").affix({offset: {top: 0} });

，没有bottom，它可以正常工作，但我需要bottom，因为footer。

问题出在哪里？

Answer 1

正如docs 建议将position: absolute 添加到.affix-bottom 似乎可以解决此问题。

所以你需要css：

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

Bootply