https://github.com/spirit/spirit

🙌 Play Spirit animations on the web
https://github.com/spirit/spirit

animation app gsap player runtime tool

Last synced: 13 days ago
JSON representation

🙌 Play Spirit animations on the web

• Host: GitHub
• URL: https://github.com/spirit/spirit
• Owner: spirit
• License: mit
• Created: 2016-06-17T15:04:59.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2024-06-25T07:42:29.000Z (5 months ago)
• Last Synced: 2024-10-01T11:09:31.034Z (about 1 month ago)
• Topics: animation, app, gsap, player, runtime, tool
• Language: JavaScript
• Homepage: https://spiritapp.io
• Size: 2.19 MB
• Stars: 749
• Watchers: 29
• Forks: 27
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

• awesome - spirit/spirit - 🙌 Play Spirit animations on the web (JavaScript)
• awesome-list - spirit

README

        


  



Spirit ⚡️ Web Player




  

    

  

  

    

  

  

    

  

  

    

  

  

    

  





  Lightweight and easy to use

  


  Play your animations on the web



### Getting Started:

- [Spirit Homepage](https://spiritapp.io)

- [Get Started](https://spiritapp.io/getstarted)

- [Documentation](https://docs.spiritapp.io)

### Browser:

```html

  

    

    

    

  

  spirit

    .loadAnimation({

      path: './animation.json',

      container: document.getElementById('container'),

    })

    .then(timeline => timeline.play());

```

### Node:

install:

```bash

npm install spiritjs --save

```

Usage:

```js

// load GSAP from CDN

import spirit from 'spiritjs';

spirit.loadAnimation({ path: './animation.json' }).then(timeline => timeline.play());

```

```js

// 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](https://docs.spiritapp.io/web-player/simple-api.html).

### Links

- [Documentation - What is Spirit](https://docs.spiritapp.io/spirit.html)

- [Documentation - Install Web Player](https://docs.spiritapp.io/web-player/install.html)

- [Documentation - Simple Usage](https://docs.spiritapp.io/web-player/simple-api.html)

- [Documentation - Extended Usage](https://docs.spiritapp.io/web-player/extended-api/)

### Examples