如何确定滚动后,浏览器窗口的底部是否已达到DIV的顶部

How to determine if after scrolling the bottom of browser window has reached top of DIV?

本文关键字:是否 顶部 DIV 底部 滚动 浏览器 窗口 何确定      更新时间:2023-09-26

我正在尝试用jQuery/Javascript解决这个问题:

当浏览器向下滚动并且窗口底部到达页脚DIV的顶部时,操作CSS代码更改。

问题示例:https://elodywedding.com/blog(确保你的浏览器窗口是移动尺寸的。)

如果你在一个较小的分辨率下滚动到页脚,页脚静态浮动,位于"tags" DIV的上方。我需要将位置设置回绝对。

任何想法如何检测滚动导致窗口到达页脚DIV的顶部?

像这样的东西似乎可以工作:https://jsfiddle.net/zk49cuy7/

<style type="text/css">
#body {
    height:1500px;
    background-color:red;
}
#footer {
    height:200px;
    background-color:blue;
}
</style>
<div id="body"></div>
<div id="footer"></div>
jQuery(function($){
    $(window).bind('scroll', function(e){
        if($(window).scrollTop() + window.innerHeight >= $('#footer').offset().top)
        {
            console.log('BOTTOM');
        }
        else
        {
            console.log('NOT BOTTOM');
        }
    });
});

绑定到窗口滚动并检查滚动顶部+窗口高度是否大于页脚的偏移顶部