跟随父元素的粘性元素

Question

我正在尝试构建在滚动 window 时跟随父元素并在到达父元素末尾时停止的粘性元素。但是，我在下限方面遇到了麻烦。我希望粘性元素停止粘在底部，但我没有用这段代码得到结果：

else if ($(window).scrollTop() >= $limit - $stickyH - 10) {
    $sticky.css('top', $limit);
}

我做错了什么？这是 jsfiddle https://jsfiddle.net/just_vr/3nb60dqc/

Answer 1

我认为你应该相对于粘性元素的父元素分配位置，并像这样以不同的方式定义你的条件

    if ($(window).scrollTop() > $start - 10 && $(window).scrollTop() <= $limit - $stickyH - 10) {
    $sticky.css({
    'position':'fixed', 
    'top': 10});
    }
     else if ($(window).scrollTop() > $limit - $stickyH - 10) {
     $sticky.css({
           'position': 'absolute',
           'top'     : 'auto',
           'bottom'  : 0
       });
     }

在这里查看 https://jsfiddle.net/aleksandarbatin/r5sa0gq3/1/

希望对您有所帮助。

跟随父元素的粘性元素

Sticky element that follows parent

jquery

sticky