向下滚动页面然后取消修复时修复div

时间:2011-10-31 16:54:15

标签: javascript css

我试图让一个侧边栏div位于标题部分下方,当你向下滚动时,它将变成一个固定的div并保持固定直到页面底部,一旦它到达页脚部分,它将坚持它的顶部,允许我向下滚动页脚区域而不再看到它。

我想在这个网站上http://madebymany.com/blog/apples-aesthetic-dichotomy

描述一个完美的例子

在左栏中,向下滚动时会粘住,然后在底部取消粘贴

我正在寻找一个很好的方法来做这个,希望是一个示例或教程,我意识到它是通过javascript更改divs属性完成的。我试过搜索但是我能找到的只是5-6岁的旧陈旧文章,他们只完成了一半的工作。我甚至不确定该怎么称呼这个功能?

3 个答案:

答案 0 :(得分:3)

该网站正在使用jQuery Scroll Follow

请注意,根据jQuery Scoll Follow网站...

  

Scroll Follow对象将保留在其直接容器内。

...因此滚动停止在您的示例网站上的评论之前停止;在页面上滚动的元素被约束在其父<aside>元素内。 You can check out the example.

答案 1 :(得分:0)

您基本上处理了网页的scroll事件并移动了该框。

大多数教程都需要jQuery,所以要熟悉它。如果你想要一个教程,这里有一个工作:http://designwoop.com/2011/01/how-to-create-a-jquery-sticky-sidebar/

为什么不分析该网站的代码呢?

答案 2 :(得分:0)

这是一个类似的问题,有一些很好的答案。

How to make div follow scrolling smoothly with jQuery?