Mixing Classic Interactions and GSAP in Webflow

Mar 02, 2026

While working on our new micro-interactions library for Waveshape, I've been combining both classic Webflow interactions and GSAP animations for some of the components. It works great overall, but there's a tiny issue that exists.

If you apply both a classic interaction and a GSAP animation directly on the same element (div, link, whatever), there might be some stuttering, jitters or misfires depending on the interaction you're creating (hover, click etc.).

The simple fix is to place your interactions on separate elements.

For example, if you have an element that should reveal some stuff on hover (GSAP), but you want the button to slightly move on the X/Y axis depending on mouse position (Classic), simply wrap the element in another div and place the Classic mouse over interaction on that wrapper.

That should fix all your issues by letting the two systems stop fighting over styles/js and everything stays smooth.

Now go animate.

Other Posts