我知道标题有点令人困惑; D但基本上我想要做的就是在这个网站上清楚地展示http://9gag.com向下滚动并注意侧边栏,有2个广告一旦第二个广告到达页面顶部它开始向下滚动页面.
我想知道怎么做?html/css或jQuery解决方案是prefared.
凯文指出,你需要做的是听取文件的scroll事件.当它被触发时,你会想看看它的值scrollTop.
$(document).scroll(function() {
var useFixedSidebar = $(document).scrollTop() >= myThresholdValue;
$('.my-sidebar-items').toggleClass('fixed', useFixedSidebar);
});
Run Code Online (Sandbox Code Playgroud)
你的CSS基本上是这样的:
.my-sidebar-items.fixedSidebar { position: fixed; }
Run Code Online (Sandbox Code Playgroud)
一个复杂的因素是,您可能希望将项目固定在新的顶部位置,并且您可能希望执行以下操作:
.my-sidebar-items.fixedSidebar { position: fixed; top: 0 }
Run Code Online (Sandbox Code Playgroud)
但是,这可能会将您的物品堆叠在一起.解决方案是将fixedSidebar类放在容器上,并使用所描述的类.