anibyvue v2.0.0

Anibyvue

基于Vue2的轻量级动画组件

Gif演示

安装方式

npm i Anibyvue

简要说明

• 每个动画模块的实现依托Vue过渡效果中不同的类名切换
• 对外提供良好的接口，可以利用Animate.css提供的动画样式进行内容扩展
• 通过webpack进行构建
• 简单的对移动端做出了适配

使用方法

1.引入css

// include animation styles
@import "./style/common.css";
@import "./style/door.css"; 

2.注册组件

import anibyVue from './components/AnibyVue.vue'

export default {
  name: 'App',
  components: {anibyVue},
  data: {
    return {
       show: false
    }
  }
}

3.组件使用

<anibyVue :show="show" animation="rotate" @hide="show = false">
    <div>A vue modal with animations.</div>
</anibyVue>

参数信息

Animation Types

• zoom
• fade
• flip
• door
• rotate
• slideUp
• slideDown
• slideLeft
• slideRight