jquery swiper3自定义切换效果的方法详解编程语言

jquery swiper3自定义切换效果的方法

 
 <div class="swiper-slide">
 <div class="wrapslide bg">
 <img class="ani bg loadimg" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0s" loadimg="{$yuming}/images/3/p3_bg.jpg" />
 <img class="ani p3_wz1 loadimg" swiper-animate-effect="suoxiaofadeIn" swiper-animate-duration="1s" swiper-animate-delay="0s" loadimg="{$yuming}/images/3/p3_wz1.png" />
 <img class="ani p3_wz2 loadimg" swiper-animate-effect="suoxiaofadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.5s" loadimg="{$yuming}/images/3/p3_wz2.png" />
 </div>
 </div>
 /*切换时就触发 用于做出场动画*/
 onSlideChangeStart: function(swiper) {
 $('.swiper-slide-prev .wrapslide').addClass('rotate')
 },
onTransitionEnd: function(swiper) {
 
 },
 onTransitionEnd: function(swiper) {
 // $('.wrapslide').removeClass('rotate');
 },

ps: 因为slide不方便做动画 所以里面加了个wrapslide 做出场动画就不冲突了 入场动画bg上一定要加动画 适当的时候切换时间用speed控制(一般不用)

还有个方法就是 切换不能淡出的画 就采取自定义触摸上滑做效果 speed设置0就可以了 快速切换