GuardDZ 发表于 2019-7-9 17:25:29

新手,问一个需求的解决方法

      <a class="changeBtn">切换slide</a>
      <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <img class="swiperTheCardImg" src="http://via.placeholder.com/219x210">
                </div>
                <div class="swiper-slide">
                  <img class="swiperTheCardImg" src="http://via.placeholder.com/219x220">
                </div>
                <div class="swiper-slide">
                  <img class="swiperTheCardImg" src="http://via.placeholder.com/219x230">
                </div>
            </div>
      </div>


var mySwiper = new Swiper ('.swiper-container', {
        effect:'fade',
      spaceBetween:11,
        simulateTouch:false,
        onlyExternal:true,
        slidesPerView:3,
        loop:true,
        slidesPerGroup:3,
        nextButton:'.changeBtn',
        observer: true,
        observeParents: true
})


代码如上   
需求   
1.同时展示3个slide.
2.切换按钮->切换效果为 fade
3.slide数据长度不定->循环展示


问题是在同时展示3个slide的情况下,把切换效果改成fade 样式就会乱

GuardDZ 发表于 2019-7-10 08:55:30

额.那咋办呢?:)

殊途 发表于 2019-7-15 14:04:47

slidesPerView的值给为 'auto'，然后设置每一个slide的宽度就可以了
页: [1]
查看完整版本: 新手,问一个需求的解决方法