gal-css-animate 组件介绍
gal-css-animate 组件基于 animate.css ，实现了多种常用的动画效果（ 请 下载 GAL 运行或者 访问微信小程序 " GraceUI 动画库" 查看效果）。
组件名称
gal-css-animate
组件属性
| 属性名称 | 类型 | 默认值 | 作用 |
| autoPlay | boolean | true | 是否自动播放动画 |
| timingFunction | String | ease-in | 速度曲线，取值参考 : https://www.w3school.com.cn/cssref/pr_animation-timing-function.asp |
| duration | String | 1s | 动画执行时间， 如 100ms，2s |
| animateName | String | flash | 动画类型，详见下面的类型表 |
| fillMode | String | none | 作用及取值参考 : https://www.w3school.com.cn/cssref/pr_animation-fill-mode.asp |
| delay | String | 0ms | 动画延迟时间 |
| iterationCount | String, Number | 1 | 动画循环次数，取值参考 : https://www.w3school.com.cn/cssref/pr_animation-iteration-count.asp |
组件事件
onMounted : 组件挂在完毕后触发的事件。
组件方法
01. play() : 播放动画方法；
02. loop(timer) : 利用 js 延迟实现循环播放动画方法，参数 : 间隔时间，单位 : 毫秒；
03. stop() : 终止 loop() 方法产生的循环；
使用方法
在需要使用动画的元素外层包裹 gal-css-animate 组件即可（需要实现动画的组件是 gal-css-animate 组件的插槽）；
演示代码
https://gitee.com/hcoder2016/grace-animation-library/blob/master/pages/demo/css-animate.vue
动画效果列表
| 动画样式名称 | 效果 |
| bounce | 回弹 |
| flash | 闪烁 |
| pulse | 脉冲 |
| rubberBand | 橡皮筋 |
| shake | 晃动 |
| headShake | 摇头 |
| swing | 摇摆 |
| tada | 缩放加摇摆 |
| wobble | 大幅度摇摆 |
| jello | 果冻 |
| heartBeat | 心跳 |
| bounceIn | 跳动进入 |
| bounceInDown | 向下飞入 |
| bounceInLeft | 左侧飞入 |
| bounceInRight | 右侧飞入 |
| bounceInUp | 向上飞入 |
| bounceOutDown | 向下飞出 |
| bounceOutLeft | 左侧飞出 |
| bounceOutRight | 右侧飞出 |
| bounceOutUp | 向上飞出 |
| fadeIn | 渐变进入 |
| fadeInDown | 渐变向下进入 |
| fadeInDownBig | 渐变向下进入大幅度 |
| fadeInLeft | 渐变左侧进入 |
| fadeInLeftBig | 渐变左侧进入大幅度 |
| fadeInRight | 渐变右侧进入 |
| fadeInRightBig | 渐变右侧进入大幅度 |
| fadeInUp | 渐变向上进入 |
| fadeInUpBig | 渐变向上进入大幅度 |
| fadeOut | 渐变消失 |
| fadeOutDown | 向下淡出 |
| fadeOutDownBig | 向下淡出大幅度 |
| fadeOutLeft | 左侧淡出 |
| fadeOutLeftBig | 左侧淡出大幅度 |
| fadeOutRight | 右侧淡出 |
| fadeOutRightBig | 右侧淡出大幅度 |
| fadeOutUp | 向上淡出 |
| fadeOutUpBig | 向上淡出大幅度 |
| flip | 快速翻转 |
| flipInX | 水平翻转 |
| flipInY | 垂直翻转 |
| flipOutX | 水平翻转后消失 |
| flipOutY | 垂直翻转后消失 |
| lightSpeedIn | 光速侠进入 |
| lightSpeedOut | 光速侠消失 |
| rotateIn | 旋转进入 |
| rotateInDownLeft | 旋转左下为轴 |
| rotateInDownRight | 旋转右下为轴 |
| rotateInUpLeft | 旋转左上为轴 |
| rotateInUpRight | 旋转右上为轴 |
| rotateOut | 旋转淡出 |
| rotateOutDownLeft | 旋转左下为轴淡出 |
| rotateOutDownRight | 旋转右下为轴淡出 |
| rotateOutUpLeft | 旋转左上为轴淡出 |
| rotateOutUpRight | 旋转右上为轴淡出 |
| hinge | 合页 |
| jackInTheBox | 动态盒子 |
| rollIn | 滚动进入 |
| rollOut | 滚动淡出 |
| zoomIn | 缩放进入 |
| zoomInDown | 向下缩放进入 |
| zoomInLeft | 从左缩放进入 |
| zoomInRight | 从右缩放进入 |
| zoomInUp | 向上缩放进入 |
| zoomOut | 缩放消失 |
| zoomOutDown | 向下缩放消失 |
| zoomOutLeft | 从左缩放消失 |
| zoomOutRight | 从右缩放消失 |
| zoomOutUp | 向上缩放消失 |
| slideInLeft | 左侧滑入 |
| slideInRight | 右侧滑入 |
| slideInUp | 顶部滑入 |
| slideOutDown | 底部滑出 |
| slideOutLeft | 左侧滑出 |
| slideOutRight | 右侧滑出 |
| slideOutUp | 顶部滑出 |
