标签：oct color first 判断 ... use change back 无效
<!DOCTYPE html> <html> <head> ... <link rel="stylesheet" href="path/to/swiper.min.css"> <link rel="stylesheet" href="path/to/animate.min.css"> </head> <body> ... <script src="path/to/swiper.min.js"></script> <script src="path/to/swiper.animate-twice.min.js"></script> </body> </html>
2.初始化
<script> var mySwiper = new Swiper (‘.swiper-container‘, { onInit: function(swiper){ //Swiper2.x的初始化是onFirstInit swiperAnimateCache(swiper); //隐藏动画元素 swiperAnimate(swiper); //初始化完成开始动画 }, onSlideChangeEnd: function(swiper){ swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画 } }) </script>
3.在需要动画的元素上添加代码
<div class="swiper-slide a"> <div class="ani" data-slide-in="at 500 from bounceInDown use swing during 500" data-slide-out="at 0 to fadeOutRight use swing during 1500 force">内容1</div> </div>
4.说明
swiper.animate~之~可以执行两种动画的升级版的Swiper Animate
标签：oct color first 判断 ... use change back 无效
原文地址：http://www.cnblogs.com/meng-qy/p/6021397.html
