Hello,
I was prototyping an animation with Webflow (for now to test it works on hover{so please hover the SpringSummer2019 Headline}; in the real live scenario, I will have a div triggering this animation when scrolled out of the view).
https://preview.webflow.com/preview/mag-ss19trends?utm_source=mag-ss19trends&preview=478a3457ebf885ba192a19bb6ef41b8d
The Idea of the animation is to make the letters fall down, so instead of having “Spring Summer 2019” I will have just SS19. Now, the “falling works”, but I need to narrow down the headline in order to have SS19 and not S S 19. To do that, I’ve added a display none in the iteraction, and give to the elements and the parent a transition all with a ease in (1000s). But looks like it’s not working, after the letters falls down, the headline will shrink in a really slow and clunky way. What am I missing? I can’t give an ease to the display none property. Should I use a custom line of css with !important to the head custom code? I would prefer to do this animation all in webflow for what that matters ^^
Thanks!
Regards
Here is my public share link: https://preview.webflow.com/preview/mag-ss19trends?utm_source=mag-ss19trends&preview=478a3457ebf885ba192a19bb6ef41b8d
