Streaming live at 10am (PST)

Anyone know how to get sections to layer over each other on scroll?


#1

I am trying to figure out how to do something like this, where the sections layer over each other as you scroll: https://www.behance.net/yearinreview/our-community.

I found this one: Help - How-To: Layered scroll interaction site design (Reference Included) but it’s not quite what I was looking for because the color blocks are actually two identical ones, with the hidden one appearing later using an interaction. I feel like there must be a simpler way, but am banging my head against the wall on this one.

Does anyone know of other examples out there or have advice?

Thanks!


#2

No Way by Webflow UI (-OR- any other CMS/Builder). This is custom code (A lot of - hh 10 year anniversary of a mega site like behance). Of course, you can add custom code to webflow.

You only can find libraries like this one (But the effect is not so complex):

fullPage.js (Search on the forum about this libary)

https://alvarotrigo.com/fullPage/extensions/scrolloverflow-reset.html#firstPage

fullPage.js multi-scrolling pages (close to your example)

https://alvarotrigo.com/multiScroll/#first

SCROLLIFY.j

COMPLEX ANIMATIONS

scrollmagic

In this library the limit is only your imagination (But you most know some JS):
Example: https://themes.materializecss.com/pages/startup-horizontal-half.html