Mastering GSAP Interactions in Webflow – Part 3-4: Event Settings Deep Dive (Control, Speed, Delay, Jump To & More)

In these 2 lessons, we explore how the Event Settings panel works behind the scenes and how properties like Control, Speed, Delay, and Jump To can be combined to build cleaner, more flexible, and more intentional interactions.
We’ll learn how to:
✅ Pause and resume infinite animations based on user interaction
✅ Freeze a timeline without breaking its logic
✅ Open and close components using only one interaction with Toggle Play/Reverse
✅ Combine multiple event triggers using custom attributes
✅ Trigger Page Load animations using Custom Events and a tiny code snippet
✅ Build hover animations that play forward and backward using one timeline
✅ Create a simple state machine using Jump To + Pause
✅ Switch background colors with clean, attribute-driven logic
✅ Use CSS transitions alongside GSAP for smoother, more elegant visual results
Episodes 1 & 2:
https://youtu.be/RKb-dsBhYxw
https://youtu.be/RDIYm79IhZI
👉 GSAP Knowledge Base: https://francescocastronuovo.com/kb/gsap-webflow/


