What does stagger each mean in GSAP?

each is the delay between one element starting and the next - stagger: { each: 0.05 } starts every element 0.05 seconds apart. amount is the alternative that divides one total duration across all elements.

How do I stagger from the center of a grid?

Pass a grid and a from origin: stagger: { each: 0.05, grid: [5, 8], from: 'center' }. GSAP computes each element's distance from the origin so the wave radiates outward - this playground previews exactly that.

Does stagger work with any tween?

Yes. stagger is a property of any gsap.to, from, or fromTo call with multiple targets - reveals, scales, fades, whatever the tween animates.

Stagger Playground

8 x 5 grid

gsap.js

FAQ

What does stagger each mean in GSAP?: each is the delay between one element starting and the next - stagger: { each: 0.05 } starts every element 0.05 seconds apart. amount is the alternative that divides one total duration across all elements.
How do I stagger from the center of a grid?: Pass a grid and a from origin: stagger: { each: 0.05, grid: [5, 8], from: 'center' }. GSAP computes each element's distance from the origin so the wave radiates outward - this playground previews exactly that.
Does stagger work with any tween?: Yes. stagger is a property of any gsap.to, from, or fromTo call with multiple targets - reveals, scales, fades, whatever the tween animates.