10 Smooth CSS Transitions For Vue.js – transitions-css

Install & Download:

# NPM
$ npm install vue-transitions-css --save

Description:

A CSS animation library that provides 10 smooth CSS transitions for Vue.js components.

Transitions Included:

• fade-x
• fade-y
• fade
• flip-x.css
• roll-in-left.css
• rotate.css
• scale-in.css
• shrink.css
• swirl.css
• tilt-in.css

How to use it:

1. Install and import the transitions-css.

import 'vue-transitions-css';

2. Apply a transition effect to your component.

<transition name="fade">
  <Content v-if="show" />
</transition>

Preview: