3

我一直在使用 JQuery，但从来没有做过这样的事情。

我想做的是：

当用户向下滚动到页面的页脚时，我想使用 JQuery 开始显示在页脚正下方加载的 10 段内容。如何使用 JQuery 做到这一点？任何现有的插件或提示？

我查找了无限滚动和类似的东西，但我不确定如何仅在用户超过页脚时触发内容的显示。

4

2 回答 2

3

将监听器绑定到滚动事件并监控滚动位置。一旦它通过了某个值，就显示内容。

您可以使用获取滚动位置.scrollTop()并将其与固定值或页脚位置进行比较.offset()。不要忘记添加窗口高度，以便在页脚可见时立即触发。

例如：

$(document).scroll(function() {
    var value = $("#footer").offset().top,
        position = $(document).scrollTop() + $(window).height();
    if (position >= value) {
        $(".content").show();
    }
});

为了确保在页脚恰好可见而不需要滚动时显示内容，您可以在准备就绪时触发滚动事件：

$(document).ready(function() {
    $(document).scroll();
});
于 2013-07-08T21:41:15.497 回答
1

实际上正确的代码需要在页脚可见时显示段落，因此您必须添加窗口高度参数：

var target = $("#footer").offset().top-$(window).height();

像这样做：

var target = $("#footer").offset().top-$(window).height();
$(document).scroll(function() {
    if ($(window).scrollTop() >= target) {
        $(".content").show();
    }
});

如果您不设置窗口高度，页脚必须到达窗口顶部，我认为这不是您想要的。

你可以在这里试试：JSFiddle

于 2013-07-08T21:54:04.157 回答