1、Swiper Animate是Swiper中文网提供的用于在Swiper内快速制作CSS3动画效果的小插件，使用方法也非常简单，页面里写的很清楚，我就不多说了，下面小例子来看吧。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="../uu/animate.min.css"/> <!--引用animate.css-->
<style type="text/css">
*{
padding: 0;
margin: 0;
}
h1{
width: 500px;
height: 100px;
background: cadetblue;
color: white;
text-align: center;
line-height: 100px;
margin: 100px auto;
}
</style>
</head>
<body>
<input type="button" name="btn" id="btn" value="点击运动" />
<br /><br />
<!--加animated这个插件的动画 ，动画的名字bouncelnleft-->
<h1 id="cc">学习animate 运动库</h1>
<script type="text/javascript">
document.getElementById('btn').onclick = function(){
var cc = document.getElementById('cc');
cc.className = 'animated bounceInLeft'; //className 属性设置或返回元素的 class 属性。
}
</script>
</body>
</html>
原文链接：https://www.qiquanji.com/post/7203.html
本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
微信扫码关注
更新实时通知