当“靠近”网站顶部时，如何使页脚“粘在”底部？

Question

当网站加载时我有这个工作。底部的页脚。然后，当您滚动到内容时，它会滚动到顶部。然后当它到达顶部时，它会在顶部粘贴（持久标题）作为站点导航。这一切都有效。

问题是，当我滚动回顶部时，我希望页脚再次“粘”到底部。现在它最终会在浏览器底部的上方或下方，具体取决于监视器。

我已经阅读了为类似主题提供的答案，它们解决了页脚粘在底部的问题，我需要的是一旦用户滚动回到网站顶部附近，它就会“粘”回到底部。

有人可以帮我完成这个吗？

这是测试站点的位置，只需滚动即可显示我的问题。

http://jsfiddle.net/billy_comic/AQrsf/

     $(function(){
     var stickyRibbonTop = $('#main-nav').offset().top;

     $(window).scroll(function(){
            if( $(window).scrollTop() > stickyRibbonTop ) {
                    $('#main-nav').css({position: 'fixed', top: '0px'});
            } else {
                    $('#main-nav').css({position: 'static', top: '0px'});
            }
    });
    });

非常感谢任何帮助。

B

Answer 1

如果从用户窗口高度不变的假设出发，可以确定footer的最小y位置。

然后，当用户滚动到此位置上方时，您可以将页眉/页脚的位置从固定（y = 0）更改为绝对（y = window_height - header_footer_height）。

在此基础上进行扩展，如果窗口高度发生变化，您也可以更新位置。