nnpc.net
当前位置:首页 >> 如何使用AnimAtE.Css >>

如何使用AnimAtE.Css

<html><style><link href="css/animate.css" rel="stylesheet"></style><body><div class="animated flipInX">123</div></body></html>

首先要下载animate.css然后在你编写页面的时候要引用这个css 在查看中文文档,或者英文文档来添加class 达到你想要的效果

在页面中引入animate.css 然后对想加动画的元素加上对应的class就可以了

首先在head中引入下载的animate.css文件 然后你想要哪个元素进行动画,就给那个元素添加上animated类 以及特定的动画类名,animated是每个要进行动画的元素都必须要添加的类.假设使用jquery,要给一个id为demo的元素添加一个摇动的

animate.ccs就是动画效果的,肯定会和animation有些冲突的!

这个是css3动画集成在一起的样式,只要在html中加入相应的类名就可以调用这个动画.

打开 animate.css 第一行.animated {animation-duration: 1s;animation-fill-mode: both;}animation-duration 即是动画的时间

<div v-show="ok" class="animated" transition="bounce">Watch me bounce</div>Vue.transition('bounce', {enterClass: 'bounceInLeft',leaveClass: 'bounceOutRight'})

调用动画的时候用逗号隔开即可,animatio:动画1,动画2,这样即可调用.

里面是写好的一些css3动画效果, 你只需要引用这个样式,调用里面的对应的效果就行了

网站首页 | 网站地图
All rights reserved Powered by www.nnpc.net
copyright ©right 2010-2021。
内容来自网络,如有侵犯请联系客服。zhit325@qq.com