修复了窗口中的元素,直到它的容器滚出视图

时间:2016-04-15 10:16:18

标签: jquery css-position sticky

我正在尝试将一个元素固定到窗口的底部但是一旦元素容器开始向上滚动并离开视口,元素就会从窗口中的position: fixed;中移除它自己,而是将其自身修复为它的底部是容器。

我已经设置了一个JSFiddle,它演示了我尝试组合在一起的两个场景。有没有人对如何实现这一点有任何想法?

1 个答案:

答案 0 :(得分:1)

冒着与自己交谈的风险,我设法弄明白了。

使用名为Waypoints的漂亮小插件,可以在元素到达屏幕上的某个点时触发操作。

因此,当底部容器在屏幕上滚动时,我将元素position: fixed;更改为position: absolute;,将其从屏幕底部移除,而是将其放在其父元素的底部。

请参阅JSFiddle了解代码