I’m currently trying out some of the new animation features of Webflow. I’m currently playing with the “show more hide” option. What I don’t get is how to set the interaction to 1. Where do you do this? I think this is the reason why my interaction is not working properly at the moment!
See why over 500,000 professional designers, marketers, and businesses have chosen Webflow to create and host their Website.
Thanks for your help!
Can you please share your project’s public link so it’s easier to understand your issue?
Learn how to do it here:
Share a read-only link | Webflow University
Ok I see the site, I see your interaction, I see that it’s a bit… jiggy… What is your question again to befgin with? I didn’t understand when you say:
thank for clearing that up (:
The effect is not working the way it should…I suspect that this is due to me now knowing how to set the interaction to 1. It mentions this in the explanation on
Website interactions and animations | Webflow
Once again, I don’t get what you mean when sayong “set the interaction to 1”. can you clarify?
Anyway, here is a video showing you how to fix your interaction:
You’ll notice I removed the padding and margins of the text element. Because you want it to disappear totally with height:0. So put your margin elsewhere, like I did, on the button.
Also passed it to overflow:hidden so it actually does mask the text when it shrinks in height.
Also removed a strange text displacement you had added.
I hope everything makes sense now (: It’s an important interaction to master in Webflow.
Thank you so much! Recreated what you did here and will have another look to fully understand what you did!