停止固定位置元素重叠页脚

Question

我有两列布局（内容+侧边栏），侧边栏很长（经过折叠），因此当您向下滚动页面时，内容div会跟随。内容是固定的位置，可以更高的内容。问题是当你一直向下滚动到页脚时，内容div与页脚内容重叠。如何让内容div不重叠？我正在使用一些js来实现滚动效果。任何帮助都会很棒，谢谢！

JS：

$(window).scroll(function() {
    if($(window).scrollTop() >= 230) {
        $('.content').css({position: 'fixed', top: '20px'});
    } else {
        $('.content').css({position: 'relative', top: 0});
    }
});