在窗口滚动期间将元素固定在容器中

Question

我有一个问题,我认为最好用图像来解释,所以我要附上它.

在此输入图像描述

好吧,基本上我拥有的是一个父容器,里面有一个元素(它实际上是一个文本块),我们将其称为FIXED元素.

当用户位于页面顶部时,我希望固定元素位于其父级的顶部.当用户开始向下滚动页面,并且父节点开始向上移动视图端口时,我希望固定元素跟随滚动直到它到达其父节点的底部,然后它停在那里.

目前还没有HTML或其他任何内容,因为我正处于本网站的粗略草图阶段.

我一般都习惯使用jQuery或javascript,我的JS技能有限,而且我熟悉jQuery,但我不介意复制和粘贴代码并搞乱它.

任何帮助将不胜感激.谢谢!

Answer 1

你想要使用javascript（有或没有jQuery）做的是绝对相对于父元素的位置更改元素的位置，父元素应该是相对的。您可以根据滚动条的位置更改位置。

本教程很好地解释了如何实现这一点。