Show Hide Text - Interaction

Design help Animations & Interactions
1

Trying to get a smooth transition on this show/hide. It’s really jerky. Not sure if there is something else on the page that is affecting it or if its not programmed right or maybe the div structure is not what it should be . Click on the Company page.

Clicking on “Show Bio” should show a scale transition of the bio text back and the reverse on the next click.

Thanks for your help!

1896×1542 368 KB
1896×1542 538 KB

Here is my public share link: https://preview.webflow.com/preview/quantifind?preview=0f46419379aba5eefea3c19a759d4362
(how to access public share link)

2

Can you share your read only link please? It is a simple solution I’m sure :wink:

3

Do you have to create the share link evey time? ie for each instance?

https://preview.webflow.com/preview/quantifind?preview=7b66e740a8cf8e280a3d447952e56931

4

No, you just need to create one link, unless you want the first one to expire for whatever reason. I will take a look at your project and I’ll get back to you.

5

Just add to the display option Overflow: hidden to the “hidden bio” div, like this:

2242×748 158 KB

Voilá

1514×982 2.32 MB

Let me know if that helps you.

Cheers,

6

That’s awesome. I never would have guessed that’s what I needed. Thanks Arron for this solution.

G