Code for GSAP SplitText plugin

Puneet Sharma

1 year ago

This is just a code snippet. I will add a demo when I get time.

gsap.registerPlugin(ScrollTrigger, SplitText); // Register plugin first

// Timeline for split text
var tl = gsap.timeline(),
mySplitText = new SplitText(".splitText", { type: "words,chars" }),
chars = mySplitText.chars;

gsap.set(".splitText", { perspective: 400 });

tl.from(chars, {
  duration: 0.8,
  opacity: 0,
  scale: 0,
  y: 80,
  rotationX: 180,
  transformOrigin: "0% 50% -50",
  ease: "back",
  stagger: 0.01
});