gsap-timeline

Create a timeline with gsap.timeline() and chain .to() calls, which append tweens sequentially by default. Use the position parameter as the third argument to control exact placement, such as "+=0.5" for gaps or "<" to start with the previous tween.

The position parameter is the third argument in timeline tween methods that controls when a tween starts. It accepts absolute times like 1, relative offsets like "+=0.5" or "-=0.2", label names, and placement shortcuts "<" (start with previous) and ">" (after previous ends).

Yes, GSAP timelines can contain other timelines using master.add(child, position). This lets you build modular animation sequences and compose them into a master timeline, though ScrollTriggers should only be placed on top-level timelines.

Use a timeline instead of chaining delays. Timelines with the position parameter give precise, maintainable control over sequencing, while delay-based chains break easily when durations change and cannot be controlled as a single unit.

Use tl.play(), tl.pause(), tl.reverse(), and tl.restart() for playback state, and tl.time(2) or tl.progress(0.5) to seek to specific points. Create a paused timeline with { paused: true } and start it later with play().