https://github.com/bestguy/ractive-animatecss
https://github.com/bestguy/ractive-animatecss
Last synced: 8 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/bestguy/ractive-animatecss
- Owner: bestguy
- License: mit
- Created: 2016-05-31T06:25:07.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2016-05-31T06:52:46.000Z (about 10 years ago)
- Last Synced: 2025-03-14T23:37:43.915Z (over 1 year ago)
- Language: JavaScript
- Size: 8.79 KB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
- License: LICENSE
Awesome Lists containing this project
README
# Ractive animate.css Transitions
Transitions for [Ractive](http://www.ractivejs.org/),
using [animate.css](https://daneden.github.io/animate.css/)
This library lets you use any of the animate.css transitions as an Ractive intro or outro
[transition](http://docs.ractivejs.org/latest/transitions) using the `animate:` prefix:
```html
RAD
```
Full list of transitions are [here](https://daneden.github.io/animate.css/).
**Based on a gist from [cfenzo](https://gist.github.com/cfenzo/63576935f3b549280f1b)**
----
## Usage
_Note: these transitions are a self-registering CommonJS module, and in the browser
requires a module system such as Webpack or Browserify._
npm install ractive-animatecss
### ES5:
```js
var Ractive = require('ractive');
require('ractive-animatecss');
```
### ES6/2015+:
```js
import Ractive from 'ractive';
import 'ractive-animatecss';
```
### In Ractive template:
```html
Cool
```