到达页面末尾时（滚动时）如何将固定 div 向上移动 200px？答案

【问题标题】：How to move fixed div 200px up when reaching the end of the page (when scrolling)?到达页面末尾时（滚动时）如何将固定 div 向上移动 200px？
【发布时间】：2012-09-13 13:53:06
【问题描述】：

我有一个包含两列（侧边栏）的页面。

左边是固定的（包含谷歌广告），即使我向下滚动页面也保持不变。

右边的包含帖子并且是相对定位的，所以滚动是可以的。

但是我在右栏（侧边栏）之后有一个页脚。

此页脚的宽度是页面的 100%。

问题是当我滚动到底部时，页脚会转到左侧边栏。

当我向下滚动时从页面末尾到达 200px 时，我想将左侧边栏移动 200px 到顶部。

并在回滚到顶部时返回。

<div id="main">
    <div id="left">Google Ads here</div>
    <div id="right">Content posts here</div>
</div>
<div id="footer">
    footer here
</div>

【问题讨论】：

有任何示例代码可以使用吗？到目前为止，您尝试过什么？
无特殊代码，但我已将其添加到我的帖子中。
看看这个 jquery plugin

标签： javascript jquery html css position

【解决方案1】：

您可以使用 jQuery 滚动。大多数网站都使用它来为其网站加载内容。

   $(window).scroll(function(){  

        if($(window).scrollTop() + $(window).height() >= $(document).height() - 200){
            setLeftBarPosition();
        }
    });

   function setLeftBarPosition(){
    // your code to set position of lefftbar

  }

【讨论】：

【解决方案2】：

您可以使用纯 CSS 而不是 javascript 来做到这一点。

阅读this了解详情。一个演示here

【讨论】：

这只是一个固定的 div 演示。它没有任何跨越 100% 宽度的页脚或页眉...
你能显示你的标记吗？我很确定您可以使用固定定位解决问题。
Lo Sauer 是对的，我需要 javascript 才能知道我何时距离底部 200 像素。