Hi,
I have a button. I want this button to open up a new section with text in it. This is pretty simple.
But I want this hidden section to slide from above to down under the section with the button. And then I want an automatic scroll to this section.
But I just can’t make it work.
Anyone knows what to do?
video: webflow-help
Make the button also an Anchor Link.
Edit: I’ve actually looked at your build now and see that you’re already doing that. The problem is that your animation starts with the section moved up, which means the anchor link is moving there. Instead, you could make the target section overflow none with 0 height, then make the height auto in your interaction. That way, the anchor will be in the correct place.
Alternatively, you can use JS to delay the anchor link until your interaction is complete, but I think the first solution is better.
Hi Max,
Tried your solution. Don’t know if I did it right or not, probably not because it’s not working. Can you show me a screenshot what you mean?
It’s a bit difficult to take a screen shot as there’s multiple things that need to be done to get your desired result. I’ll try and make it simpler and break it down.
Make your button an anchor link to the section #tekst-zichtbaarbeter-CTA
Remove the hide/show of #tekst-zichtbaarbeter-CTA in your interaction
Give #tekst-zichtbaarbeter-CTA a starting height of 0px in your interaction (you will have to remove the min-height and set it to height auto on the section’s class — you will also likely need to remove the sections padding so it may be easier to use a div wrapper instead of animating the section so you don’t have to add further classes to your content to keep your padding consistent)
Make the next step in your interaction height Auto for #tekst-zichtbaarbeter-CTA with the desired time and easing of the effect
Make the #tekst-zichtbaarbeter-CTA section have a class that means it has an overflow of none
If you do all these steps, it should work as intended.
Video of it working: example
Thanks, it worked nicely!
