alambaha / gsap-class-based-splitText-plugin

Its free splittext plugin for gsap3 animations

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

GSAP Split Text Tool

Basic Usage

	import { SplitText } from "./assets/splitText.js"

	const text = document.querySelector("h1.test")
	const splittedText = new SplitText(text, ["words", "chars"]) 

And Animating with GSAP

	import { gsap, TimelineLite } from "./assets/gsap/all.js"
	import { SplitText } from "./assets/splitText.js"

	const text = document.querySelector("h1.test")
	const splittedText = new SplitText(text, ["words", "chars"]) 

	const textTimeline = new TimelineLite()

	textTimeline.staggerFromTo(splittedText.chars, 0.5, 
	// From
	{
		rotateZ:360,
		opacity:0
	},
	// To
	{
		rotateZ:0,
		opacity:1
	},
	0.02)
    

About

Its free splittext plugin for gsap3 animations


Languages

Language:JavaScript 99.7%Language:HTML 0.3%