2.0.0 • Published 6 years ago
bee-animations v2.0.0
bee-animations
css3帧动画不仅功能强大,而且性能出色。遗憾的是没有提供动画序列,只能单条使用,于是制作此库实现动画的列表调用
此库只提供帧动画的调用,你可以使用animate.css
动画库,也可自己定义
引入
- install
npm install bee-animations
# or
cnpm install bee-animations
# or
yarn add bee-animations
import beeAnimations 'bee-animations'
- cdn
<script src="https://unpkg.com/bee-animations@2.0.0/build/index.js"></script>
使用
// beeAnimations(options)
beeAnimations(
el: '.animate',
animations: [
{
name: 'bounceIn',
duration: 2,
delay: 0,
count: 1,
callback: ()=>{
console.log('es bounceIn')
}
},
{
name: 'fadeOut',
duration: 2,
delay: 0,
count: 1,
callback: ()=>{
console.log('es fadeOut')
}
}
]
})
参数
** ?
表示可传参数
options
属性 | 类型 | 解释 | |
---|---|---|---|
el | string | element | 目标元素 |
animations | array | 动画队列 | |
only ? | bool | 是否忽视动画属性的次数并默认为1 | |
callback ? | function | 所有动画完成之后的回调 |
animations
属性 | 类型 | 解释 |
---|---|---|
name | string | 帧动画名称 |
duration | number | 动画持续时间 |
delay | number | 动画延迟时间 |
count | number | 0表示无限循环 |
callback ? | function | 动画后的回调 |
案例
更多
需要添加功能或者存在 bug
请提交 issues
,在空余时间会尽快处理。