Question

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

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

正确的一个包含帖子并且相对定位，因此滚动就可以了。

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

此页脚的宽度是页面的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>

Answer 1

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

   $(window).scroll(function(){  

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

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

  }

Answer 2

您可以使用纯CSS而不是javascript来执行此操作。

阅读this了解详情。演示here

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

2 个答案: