I’m trying out the new GSAP timeline but it’s leavings me with quite a lot of questions:
1: where can I find more tutorials explanations on how the whole new UI works?
2: Is it possible to heave a delay on repeat interactions. So I want an animation to repeat, but not immediately after eachother. I want there to be a delay in between.
3: I wanna show and hide my navbar. I used to use scroll direction for this in the old Interaction UI. I cant seem to find scroll direction in the new UI. Is this still possible?
Thank you
1 Like
Hi there,
For working with GSAP timelines in Webflow, you can access the timeline settings by clicking the “back” button next to your action’s name. This will reveal options for controlling animation behavior, including repeat counts, infinite loops, and yoyo effects for your animations.
For navbar scroll animations, first ensure your navbar is set to a fixed position. You can then create scroll-triggered animations using the “When Scrolled Down” and “When Scrolled Up” interactions. Set the Y-axis movements to hide the navbar when scrolling down and reveal it when scrolling up. Adjust the easing and duration settings to achieve your desired animation smoothness.
For additional guidance and examples, check out the Webflow x GSAP Resource Hub at gsap.com/resources/Webflow/. This resource contains detailed tutorials and explanations for implementing various GSAP animations.
Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.
1 Like