左侧粘滞的div,向右滚动

时间:2016-08-09 04:42:36

标签: jquery html css

我一直在寻找投资组合的想法,我遇到了一个简单而美观的设计。我现在迷失了如何实现这种布局,特别是它的粘贴元素。我没有自己的代码可供比较,但有人可以帮我弄清楚它是如何工作的吗?谢谢!

http://melaniedaveid.com/

另外:我可以让这个概念适用于一个部分,而不是一秒钟。 (即从“关于”部分到“工作”部分。

1 个答案:

答案 0 :(得分:0)

您正在寻找的是粘性定位。 有几种方法可以实现类似的东西。可以找到一个很好的概述here

我认为最简单的解决方案是使用CSS属性position:sticky;。但它在许多浏览器中都不受支持。幸运的是有许多可供选择的填充物,如position--sticky-,所以你现在可以使用它!

那么如何使用position:sticky;?您还需要指定所需的top值,并指定元素将粘贴的顶边距离。所以大多数情况下你希望它是top: 0;。然后 - 滚动时 - 当元素与顶部的距离达到0时,元素会粘住。