Cascading/Staggered Animation On Mount/Unmount React

Viewed 54

I am trying to build a React component with the following features:

When "Information" on the html body is clicked, a component slides left.

The component has different tags (<h1> <h3><h5> etc.) that should then stagger and fade in with a small intermittent delay.

When the component is clicked to be scrolled out, the tags should stagger and fade out.

The CodeSandbox

Please someone help me, I have tried framer motion, spring, csstransitions... etc, but i cannot get what I thought would be a quite trivial task to work robustly!

Thank you so much.

EDIT: This means that I would like this to happen automatically without the button

0 Answers
Related