How did Webflow create their "Features Col"?

[anthonychan2509 (Anthony C.)]

Does anyone know how to create what Webflow did for their “Features Col” on Automate and connect your website | Webflow Logic? It’s amazing!

Without seeing this, I will use “Tab” for certain, but the outcome is not as ideal as this since the tabs will stack on the top of tab contents.

We can use JavaScript to move the content to the right places. The way Webflow is cleaner, smarter, and more friendly to accessibility.

Take a look:

You can see that they are not using the native “Tab” block, but using <ul> with three <li> inside, and the “content” is within each <li>.

[thomasduthie]

Maybe I’m not understanding but why not just use on click animations?

Really the only thing that’s happening is you’re clicking on the div (feature) - it’s changing styling to add drop shadow, remove the bottom border and add a little size to the div. At the same time (on click) of the div, the image is fading up either with .1 or 0 duration.

On the second click, you return to the original state.