我如何阻止固定元素超出页脚与jQuery

Question

我做了侧边栏中的“开始”元素，当它滚动超过某个点时，但在较小的笔记本电脑屏幕（14“至18”），当用户向下滚动，最终跑到页脚中。

我想要设置它，以便一旦它检测到粘滞区域内，比如10个像素的页脚，它就会停止。

链接到网站

http://previewyournewwebsite.info/otsl/compare-reverse-mortgage-loan-products

这是我使用的代码：

function sticky_relocate() { 
     var window_top = $(window).scrollTop(); 
     var div_top = $('.sticky-anchor').offset().top; 
     if (window_top > div_top) 
      $('.sticky-element').addClass('sticky') 
     else 
      $('.sticky-element').removeClass('sticky'); 
    } 

    $(function() { 
     if ($('.sticky-anchor').length != 0){ 
      $(window).scroll(sticky_relocate); 
      sticky_relocate(); 
     } 
    }); 

Answer 1

什么类似的东西

function sticky_relocate() { 
    var sticky_element = $('.sticky-element'); 
    var window_top = $(window).scrollTop(); 
    var div_top = $('.sticky-anchor').offset().top; 
    var div_height = sticky_element.height(); 
    var footer_top = $('.footer').offset().top; 
    if (window_top > div_top) { 
     sticky_element.addClass('sticky') 
    } else { 
     sticky_element.removeClass('sticky'); 
    } 
    if(div_top + div_height > footer_top - 10) { 
     sticky_element.css("top", footer_top - 10); 
    } 
} 

$(function() { 
    if ($('.sticky-anchor').length != 0){ 
     $(window).scroll(sticky_relocate); 
     sticky_relocate(); 
    } 
}); 

获取div的高度，并检查是否它的顶部位置+高度不会超过f的顶部位置ooter。