Spirit ⚡️ Web Player
Lightweight and easy to use
Play your animations on the web
Getting Started:
Browser:
<svg>
<g id="container">
<path d="..." data-spirit-id="body" />
<path d="..." data-spirit-id="mouth" />
<path d="..." data-spirit-id="legs" />
</g>
</svg>
<script src="https://unpkg.com/spiritjs/dist/spirit.min.js"></script>
<script>
spirit
.loadAnimation({
path: './animation.json',
container: dcument.getElementById('container'),
})
.then(timeline => timeline.play());
</script>Node:
install:
npm install spiritjs --saveUsage:
// load GSAP from CDN
import spirit from 'spiritjs';
spirit.loadAnimation({ path: './animation.json' }).then(timeline => timeline.play());// use existing GSAP instance
import gsap from 'gsap';
import spirit from 'spiritjs';
spirit.setup(gsap).then(() => {
spirit.loadAnimation({ path: './animation.json' }).then(timeline => timeline.play());
});For more info check out the API Documentation.
Links
- Documentation - What is Spirit
- Documentation - Install Web Player
- Documentation - Simple Usage
- Documentation - Extended Usage
Examples
