On scroll pages or divs flow to the the top or down

[j36g2]

Hello there
anyone an idea how to implement this scroll behavior?
cafelit.de
whats the html5 and css to it?

[felix_rabe]

@j36g2 maybe these color-planes are very high, like three times the window height, and the text inside these planes has "position: sticky; top:0;" Then you have to fiddle with some custom css to align them one after each other.

[j36g2]

i tried it out, it doesnt work : (

[felix_rabe]

@j36g2 try to inspect the code and figure it out.

You are basically scrolling all layers at once but it just looks like its one after each other.

the approach is the right one. front layer is 100vh, 2nd layer is 200vh, etc., use "z-index" to put them behind each other. then inside these layer is a div with position sticky that contains the text. You can use http://codepen.io to try the structure and then try to somehow do that with lay theme.

[j36g2]

thanks for the analysis, i will try it out based on your describtion