微信小程序 使用animate动画教程

1.下载文件。

路径：https://download.csdn.net/download/qq_42740797/12703601
官网路径：https://animate.style/

2.在项目根目录新建一个“style”文件夹存放下载样式文件。

3.全局导入样式，在“app.wxss”文件最开始引入。

4.使用。

注意：动画类要去掉“animate__”.
每个动画都有的五个参数：

animation: 动画名 持续时长 速度曲线 开始时延迟的时长 播放次数 轮流反向播放

第一种：
直接给全部类。

<view class="animate heartBeat infinite">动画</view>
//第一个类：animate基本类 第二个类：需要执行的动画类 第三个类：一直执行该动画。

第二种：
在类样式中引用animate，添加完成后再引用该类。
示例如下：

.move{
  animation: heartBeat 1s infinite; 
  //第一个参数：动画 第二个参数：执行时长 第三个参数：一直执行该动画。
}

<view class="move">动画</view>