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

gdf*_*dfg 7 html css twitter-bootstrap affix twitter-bootstrap-3

我有一个带有固定左侧边栏的长页面:

<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>
Run Code Online (Sandbox Code Playgroud)

和js affix:

$("#sidebar").affix({offset: {top: 0, bottom:420} });
Run Code Online (Sandbox Code Playgroud)

我有和页脚height:390px.当我第一次滚动到页面底部并尝试向上滚动时,侧边栏返回到它的第一个位置(到页面顶部),它position:fixed不再是.它采用内联样式position:relative,并附带Bootstrap JS.当我滚动到顶部时,我看到类已更改为affix-top.每个其他滚动页面位置,类affix,即使它是页面底部和侧边栏保持position:relative.如果我只使用:

$("#sidebar").affix({offset: {top: 0} });
Run Code Online (Sandbox Code Playgroud)

,没有bottom,它工作正常,但我需要bottom,因为footer.

哪里可以问题?

Zac*_*Zac 7

正如文档建议添加position: absolute.affix-bottom似乎解决这个问题.

所以你需要css:

#sidebar.affix-bottom {
  position: absolute;
}
Run Code Online (Sandbox Code Playgroud)

Bootply