当“靠近”网站顶部时，如何让我的页脚“粘”到底部？

Question

我在加载网站时有此工作。底部的页脚。然后当您滚动到内容时，它会滚动到顶部。然后当它到达顶部时，它会在顶部粘贴（持久性标题）以进行站点导航。一切正常。

问题是，当我滚动到顶部时，我希望页脚再次“粘”到底部。现在它将根据显示器结束在浏览器的上方或下方。

我已经阅读了针对类似主题提供的答案，它们解决了粘贴在底部的页脚，我需要的是当用户在网站顶部附近向后滚动时“粘贴”回到底部。 / p>

有人能帮助我做到这一点吗？

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

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'});
            }
    });
    });

非常感谢任何帮助。

乙

Answer 1

如果您假设用户的窗口高度不会改变，您可以确定页脚的最小y位置。

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

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