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控制(一般不用)

原创文章如转载,请注明本文链接: http://newmiracle.cn/?p=2879

发表评论

电子邮件地址不会被公开。 必填项已用*标注