官网地址：daneden.github.io/animate.css…
源码地址：github.com/daneden/ani…
简介：
一个跨浏览器的 css3 动画库，内置了抖动（shake）、闪烁（flash）、弹跳（bounce）、翻转（flip）、旋转（rotateIn/rotateOut）、淡入淡出（fadeIn/fadeOut）、放大缩小（等多达 60 多种动画效果，几乎包含了所有常见的动画效果。在炫酷的同时，还一直保持着易于使用的特点。
使用：
① 将样式表包括在文档的 (在线CDN)
<link href="https://cdn.bootcss.com/animate.css/3.7.2/animate.css" rel="stylesheet">
(将文件下载带本地引入)
<head>
<link rel="stylesheet" href="css/animate.css">
</head>
(npm安装) npm i animate.css -S -D
② 给需要执行动画的元素添加类名 animated这个类名是animated.css的基类, 但凡需要通过animated.css来添加动画, 都需要添加这个基类给需要执行动画的元素添加类名
<div class="animated"></div>
<div class="animated bounce"></div>
<div class="animated bounce infinite delay-3s"></div>
<div class="animated bounce"></div><div class="animated myFadeIn"></div>
③ 关于动态添加删除动画效果 原生JS核心代码
dom.classList.add('animated'); // 添加
dom.classList.add('bounceOut'); // 添加
dom.classList.remove('animated'); // 删除
Jquery
$('#dom').addClass('animated bounceOut'); // 添加
$('#dom').removeClass('bounceOut'); // 删除
Vue在data中声明isAnimate和isBounOut，值为Boolean类型。
<div :class="{animated: isAnimate, bounceOut: isBounOut}">bounceOut</div>
在对应的需要改变动画有无的事件或逻辑里修改isAnimate和isBounOut的值。
