Ractive animate.css Transitions

Transitions for Ractive, using animate.css

This library lets you use any of the animate.css transitions as an Ractive intro or outro transition using the animate: prefix:

    <h2 intro="animate:TRANSITION_NAME">
      RAD
    </h2>

Full list of transitions are here.

Based on a gist from cfenzo

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:

var Ractive = require('ractive');
require('ractive-animatecss');

ES6/2015+:

import Ractive from 'ractive';
import 'ractive-animatecss';

In Ractive template:

    <div intro="animate:bounceInDown" outro="animate:fadeOut">
      Cool
    </div>