javascript - 到达容器div末尾时如何更改div上的CSS "position"？

Question

我正在为一个网站开发一项功能，该功能会在包含社交分享按钮的单个帖子页面的左侧创建一个栏。当读者滚动时，该栏跟随页面向下移动。它类似于在 Mashable.com 上找到的那个。

但是，该栏将继续向下滚动页面到网站的页脚区域，但我希望它在到达容器 div 的末尾(页眉和页脚之间的主页内容)时停止。

我猜测涉及将“position:fixed”更改为“position:absolute”的 JavaScript，但我不确定确切的代码是什么。

有没有人有想法/可以帮助我？

Answer 1

喜欢这个 jsFiddle ？

基本的 jQuery 是:

var stickerTop = parseInt($('#sticker').offset().top);
$(window).scroll(function() {
    $("#sticker").css((parseInt($(window).scrollTop()) + parseInt($("#sticker").css('margin-top')) > stickerTop) ? {
        position: 'fixed',
        top: '0px'
    } : {
        position: 'relative'
    });
});