Daiaiai
Daiaiai

Reputation: 1089

How to combine GreenSock's (GSAP) ScrollTrigger and TextPlugin

How can I combine ScrollTrigger with their different plugins, e.g. TextPlugin? Like tweening

<h2 id="tweenthat">That</h2>

to

<h2 id="tweenthat">This</h2>

when #tweenthat comes into view.

Upvotes: 0

Views: 484

Answers (1)

Zach Saucier
Zach Saucier

Reputation: 25954

A ScrollTrigger can be added to any tween or timeline (in addition to being created in a standalone way). So just create the animation that you want then attach it to a ScrollTrigger. For example: https://codepen.io/GreenSock/pen/LYZrjqJ

gsap.to("#myText", {
  duration: 2, 
  text: "thank you for waiting", 
  delay: 1,
  scrollTrigger: {
    trigger: "#myText"
  }
});

Upvotes: 1

Related Questions