javascript - 从元素底部计算像素

我正在尝试创建一个滚动器，当用户靠近元素底部时将加载内容，但是当用户滚动时，我正在努力计算距元素#grid底部的当前距离。

$(window).scroll(function (event) {
    var scroll = $(window).scrollTop();
    var div = $('#grid');
    var bottom = ((div.offset().top + div.height()) - scroll);

    $('.scroll').html(bottom);
});

.scroll元素显示该值，尽管它似乎没有给出正确的数字。任何想法，我都会停滞不前。我似乎正在获取从窗口顶部到容器底部的距离，而不是从当前滚动位置开始的距离？

页面顶部



向下滚动

最佳答案

您还需要添加窗口的高度。

$(window).scroll(function (event) {
    var scrollBottom = $(window).scrollTop() + $(window).height();
    var div = $('#grid');
    var bottom = ((div.offset().top + div.height()) - scroll);

    $('.scroll').html(bottom);
});

如果bottom的负数小于窗口高度，则#grid div的底部在屏幕上可见。