页面部分的视差，其余部分正常滚动

Question

我有一个页面，由几个部分组成。所有这些（除了最后一个）都必须采用屏幕的整个高度，视差滚动，最后一个 - 根据其内容具有动态高度。内容比屏幕高几倍，并且必须正常滚动。

Here's codepen https://codepen.io/eagor/pen/MozVjo I've edited a bit to show what I need to achieve.前三部分的行为就像我需要的一样。唯一要添加的 - 正常滚动的最后一节。

Answer 1

你可以去像

.background:nth-child(4) { 
    height: 100%; 
    overflow-y: scroll; 
    ... 
} 

现在你只需要重新定义你透明背景。