javascript - 在一定距离后使div随页面滚动

Question

我有一个网页设置了 225px 的标题空间，然后正文开始。我有一个 float 的 div，我想在页面向下滚动时跟随它的主体。 div 紧随其后，但我不希望它在用户滚动过标题之前启动。这是一个图片示例:

一旦用户滚动过所有红色 (225px)，蓝色 div 应该随页面滚动。

当前的问题是 div 在用户滚动通过标题的那一刻开始移动，并在页面顶部下方 225 像素处结束。

我相信我需要这样的东西，但它似乎没有做任何事情(至少在 chrome 中)

if($(window).scrollTop() > 255)
    {
        //begin to scroll
        $("#floating_list").css("position","fixed");
        $("#floating_list").css("top",0);
    }
    else
    {
        //lock it back into place
        $("#floating_list").css("position","relative");
    }

谢谢!

Answer 1

您还没有设置任何事件监听器。包括 JQuery，这里是工作代码:

$(document).on("scroll", function(){ 
// or as a shorthand $(document).scroll(function(){
if($(document).scrollTop() > 255)
    {
        //begin to scroll
        $("#floating_list").css("position","fixed");
        $("#floating_list").css("top",0);
    }
    else
    {
        //lock it back into place
        $("#floating_list").css("position","relative");
    }
});