如何让 div 到达页面顶部后随页面向下滚动？

我知道标题有点令人困惑；D 但基本上我想要做的事情已经在这个网站上清楚地展示了http://9gag.com http://9gag.com向下滚动并注意侧边栏，有 2 个广告，一旦第二个广告到达页面顶部，它就会开始向下滚动页面。

我想知道如何做到这一点？首选 html/css 或 jQuery 解决方案。

正如凯文指出的，你需要做的就是听文档的内容scroll事件。当它被触发时，你会想看看它的值scrollTop.

$(document).scroll(function() {

    var useFixedSidebar = $(document).scrollTop() >= myThresholdValue;
    $('.my-sidebar-items').toggleClass('fixed', useFixedSidebar);

});

你的 CSS 基本上是这样的：

.my-sidebar-items.fixedSidebar { position: fixed; }

一个复杂的因素是，您可能希望将这些项目固定在新的顶部位置，并且您需要执行以下操作：

.my-sidebar-items.fixedSidebar { position: fixed; top: 0 }

然而，这可能会将您的物品堆叠在一起。解决这个问题的方法是将fixedSidebar容器上的类，并按照描述使用该类。

Demo http://jsfiddle.net/jPxEY/