关于滚动函数，它适用于$(窗口)，但不适用于$(文档)，为什么？

Question

我正在开发一个函数，一旦粘性页脚到达元素-> #line-before-related-article，就必须将其隐藏起来。当我使用$(document)时，当我开始向下滚动时，粘性页脚就消失了，这不是我想要的。

当我使用$(window)时，粘性页脚在到达#line-before-related-article之前就消失了，这几乎就是我所需要的。我希望粘性页脚仅在到达id为#line-before-related-article的div时消失。

$(window).scroll(function() {
    if ($(this).scrollTop() + $(this).height() >= $('#line-before-related-article').position().top) {
        console.log(console.log($('#line-before-related-article').position().top))
        $('.sticky-footer').hide();
    }
});

我认为，一旦我的函数使用$(document)正常工作，我的问题就会得到解决。

有什么建议吗？

Answer 1

window对象带有scroll属性，并激发关于浏览器的相应事件。正如您在其名称上看到的，document对象从上到下引用DOM元素。在浏览器中滚动内容不会在DOM对象上触发事件！

您必须通过使用CSS启用滚动功能。

以下是来自jquery网站的解释：https://api.jquery.com/scroll/

当用户滚动到元素中的不同位置时，会向该元素发送scroll事件。它适用于窗口对象，但也适用于overflow CSS属性设置为scroll (或当元素的显式高度或宽度小于其内容的高度或宽度时为auto )的可滚动框架和元素。

当您的元素没有滚动功能时，它将不会携带滚动事件功能。您必须注意CSS代码才能启用scroll事件。