Question

您好我一直试图在包装div中制作一个固定的侧边栏，但却没有运气。该页面为http://www.rayshaft.com/sample.html，当我向下滚动其他新闻部分时，我需要侧边栏保持固定状态。部分结构如下：

<section class="secondary">
 <section id="sidebar">
 ...
 </section>
 <section id="othernews">
 ...
 </section>

我尝试在“辅助”部分内进行绝对定位，修复，实际上相对于浏览器窗口修复了侧边栏，我尝试了这个看起来正是我需要的查询：http://jsfiddle.net/bryanjamesross/VtPcm/但是我做不到它适用于我的页面。知道我做错了什么吗？提前谢谢

Answer 1

尝试使用.position()代替.offset()，并从脚本末尾删除额外的符号â€‹

$(function() {
    var top = $('#sidebar').position().top - parseFloat($('#sidebar').css('marginTop').replace(/auto/, 0));
    var footTop = $('#footer').position().top - parseFloat($('#footer').css('marginTop').replace(/auto/, 0));
    var maxY = footTop - $('#sidebar').outerHeight();
$(window).scroll(function(evt) {
    var y = $(this).scrollTop();
    if (y > top) {
        if (y < maxY) {
            $('#sidebar').addClass('fixed').removeAttr('style');
        } else {
            $('#sidebar').removeClass('fixed').css({
                 position: 'absolute',
                  top: (maxY - top) + 'px'
            });
        }
    } else {
        $('#sidebar').removeClass('fixed');
    }
});
}); //â€‹ What are this symbols ???? remove them!

固定侧边栏内包装div

1 个答案: