GSAP Custom Stagger Start Point

Use cycle and delays to make stagger start in the middle of a set

GSAP stagger is good at taking a set and animating it from the first element to last, in that order (or reverse). But what if we want it to start in the middle and work its way "out" from the point of interaction? Well, we can! By overriding the delay in stagger with a custom one in the "cycle" property. Tip of the hat to Mary Lou's Multi-level menu blueprint at Codrops for inspiring this (and the important bit of code that makes it work).

Click a character to see it in action!