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>

和js代表affix：

$("#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

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

1 个答案: