Chapter 346: .refresh

Core Idea

Forces the ScrollTrigger instance to re-calculate its start and end values (the scroll positions where it'll be activated).

Code Examples

// create a timeline with a ScrollTrigger
const tl = gsap.timeline({ scrollTrigger: {...}});

// after adding all animations to that timeline, we can manually force it to calculate its start/end (on just that instance):
tl.scrollTrigger.refresh();

// or cause ALL ScrollTrigger instances to refresh using the static method:
ScrollTrigger.refresh();

• What it demonstrates: typical usage of .refresh in a GSAP animation.

Key Takeaways

1. Forces the ScrollTrigger instance to re-calculate its start and end values (the scroll positions where it'll be activated).

Connects To

• ScrollTrigger.refresh(): see ch368 — ScrollTrigger.refresh