1.下载css文件
animate.css4.x不支持app,最好下载3.7.x
下载地址. http://www.haorooms.com/uploads/example/Animatecss/

我尝试用 npm install animate.css --save 尝试了之后,发现好像没用,后面直接下载Animate.css文件,放在项目中,可以正常使用
2.在app.vue中引入
@import ‘./common/animate.css’
不要用@import url("./common/animate.css’"); 运行会报错!!!!
请添加图片描述
3.使用

<view class="animated" hover-class="bounce">
<view class="animated flash">An animated element</view>
<h1 class="animated bounce">An animated element</h1>

我发现用hover-class="bounce"是点击之后,触发
而直接class="animated flash"是打开页面之后触发,播放一次动画,这个我目前试了是这样的。可能后面会再修改,再记录。。。

补充
class=“animated bounceIn infinite”
这个是打开页面之后,动画一直播放

修改动画时常
.animated{
animation-duration: 1.5s;
}

Logo

分享最新的 NVIDIA AI Software 资源以及活动/会议信息,精选收录AI相关技术内容,欢迎大家加入社区并参与讨论。

更多推荐