Question

使用Bootstrap 3.1.1及其JavaScript组件＆＃34;词缀＆＃34;。我已经让它在大屏幕上工作（工作正常，没有问题），但是当我以较小的屏幕尺寸查看网站时，我遇到了一个问题。当我向下滚动页面时，词缀元素最初会跟随，但是当我到达页脚之前的末尾时，它会重置回顶部并停止工作。不知道为什么。

HTML：

<div class="container">
    <div class="main-content"></div>
    <div class="sidebar my-affix"></div>
    <div class="footer"></div>
</div>

JS：

$('.my-affix').affix({
    offset: {
        top: 20,
        bottom: function() {
            return (this.bottom = $('.footer').outerHeight(true));
        }
    }
});

Answer 1

您必须为.affix-bottom提供一种样式并将其设置为position: absolute，否则偏移将position: relative应用于该元素，并在您到达底部后将其“弹出”到顶部页面并向上滚动。

价： https://github.com/twbs/bootstrap/issues/9342#issuecomment-22819766

小视口上的Bootstrap Affix问题

1 个答案: