到达页面底部时显示页脚答案

【问题标题】：Show footer when reaching bottom of page到达页面底部时显示页脚
【发布时间】：2015-01-10 08:49:25
【问题描述】：

我看到了一些类似的问题，但他们没有给我解决方案。我希望在到达页面底部时显示页脚 (slideUp)，并在向顶部滚动时再次隐藏。现在我正在使用一个脚本，在一定量的滚动后显示页脚。

这里是Fiddle

有人知道怎么做吗？

$(window).scroll(function() {
if ($(this).scrollTop() > 10) {
    $( 'footer').slideDown(300);
} else {
    console.log('there');
    $('footer').slideUp(300);
}
});

【问题讨论】：

标签： javascript html css scroll footer

【解决方案1】：

将$(this).scrollTop() 与您的窗户/车身高度进行比较，而不是与固定值进行比较。

【讨论】：

【解决方案2】：

试试这个检查工作jsfiddle

 $(window).scroll(function () {
        if ($(window).scrollTop() + $(window).height() == $(document).height()) {
            $('footer').slideDown(300);
        } else {
            $('footer').slideUp(300);
        }
  });

【讨论】：

感谢朋友的小提琴！

【解决方案3】：

    var height;
    var trigger = 350;
    $(window).scroll(function() {
        height = $(document).height()-$(window).height();
        console.log(height+" "+$(this).scrollTop());
    	if ($(this).scrollTop() > height - trigger) {
    		$( 'footer').slideDown(300);
    	} else {
    		$('footer').slideUp(300);
    	}
    });

为了获得更好的性能，将窗口高度计算和文档高度计算放在滚动功能之外，并在加载后运行一次 ($(){}) 并在调整窗口大小时重新计算 ($(window).resize(function(){})

【讨论】：

谢谢伙计！我认为这对我来说是最好的。到达底部并切换隐藏/显示/隐藏/显示等时它不是那么敏感。再次感谢您！