v-animate-css

The easiest to implement Vue directive for Animate.css

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
v-animate-css
9460.0.616 days ago5 years agoMinified + gzip package size for v-animate-css in KB

Readme

Vue Animate CSS
GitHub forks GitHub Repo stars

v-animate-css

The easiest way to implement Vue directive for Animate.css
If you like this project, please give it a star :star: , and consider following the author :octocat: :wink: .

Installation using NPM

npm install v-animate-css --save

OR

Installation using YARN

yarn add v-animate-css

Or just import this to project without installing

Using CDN

https://unpkg.com/v-animate-css/dist/v-animate-css.js

Getting Started

Usage

import Vue from 'vue';
import VAnimateCss from 'v-animate-css';

Vue.use(VAnimateCss);

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.4/vue.js"></script>
<script src="https://unpkg.com/v-animate-css/dist/v-animate-css.js"></script>

<script>
  Vue.use(VAnimateCss.default);
</script>

Inject Local CSS

Related to Issue#33 it make sense to give the user the option to add their own local version of Animate.css instead of relying to the default CDN version of Animate.css within the plugin.
You can do it using the new animateCSSPath option.
import Vue from 'vue';
import VAnimateCss from 'v-animate-css';

Vue.use(VAnimateCss, { animateCSSPath: './local-animate-css-file.css' });

// You can also use this option to inject a newer version of Animate.css
Vue.use(VAnimateCss, { animateCSSPath: 'cdn-link-to-a-newer-animate-css-version' });

Demo and Docs here.
Made with :heart: by Joff Tiquez