移动div与窗口滚动不一致

我需要我的侧边栏与窗口上下滚动，但在div处于顶部或底部时停止。下面的代码在页面首次加载并向下滚动或页面缓慢滚动时工作，但当页面滚动到侧栏div最底部时，页面必须到达顶部（然后是一些）为了触发这个保证金变化。移动div与窗口滚动不一致

除了滚动条之外，还有其他一些触发器我应该寻找吗？我如何调整此代码以正确调整div？

$(window).on("load scroll", function() { 
    var scrollYpos = $(document).scrollTop(); 
    var sidebarinfo = $("#sidebar").offset().top + $("#sidebar").height(); 
    var windowinfo = $(window).height() + $(window).scrollTop(); 
    if ((windowinfo)<(sidebarinfo)){ 
     $('#sidebar').css('margin-top', -scrollYpos); 
    } 
});

侧栏div是固定的位置。如果我使用绝对位置，div可以很好地滚动，但是当div底部已经到达时它不会停止 - 它只是继续与窗口一起滚动。

我已经用此代码解决了问题的主要部分。

$(window).on("load scroll", function() { 
    var sidebarinfo = $("#sidebar").scrollTop() + $("#sidebar").height(); 
    var windowinfo = $(window).innerHeight() + $(window).scrollTop(); 
    if ((windowinfo)<(sidebarinfo)){ 
     $('#sidebar').css('top', -($(window).scrollTop())); 
    } 
});

唯一的问题是在网页加载时，侧边栏陷在错误的位置上，直到它滚动一路上涨（及以上）。

来源

2014-10-03 testing123

你需要使它'的位置是：绝对的;'然后听滚动事件，每次这个变化，你需要将位置调整到窗口顶边的任何位置。（它实际上更复杂，因为当它们向后滚动时，需要允许它从边缘向下移动） – 2014-10-03 01:04:43

其实我想通了，我需要调整一些东西，添加一个else子句：

$(window).on("scroll", function() { 
    var scrollmargin = $(window).scrollTop() - $("#sidebar").outerHeight(); 
    var sidebarinfo = $("#sidebar").scrollTop() + $("#sidebar").outerHeight(); 
    var windowinfo = $(window).innerHeight() + $(window).scrollTop(); 
    console.log($(window).scrollTop()); 
    if ((windowinfo)<(sidebarinfo)){ 
     $('#sidebar').css('top', (sidebarinfo + scrollmargin)*-1); 
    } 
    else { 
     var margintop = $(window).innerHeight() - $("#sidebar").outerHeight(); 
     $('#sidebar').css('top', margintop); 
    } 
});

来源

2014-10-03 00:43:06 testing123

移动div与窗口滚动不一致

回答

相关问题