Swiper中文论坛

标题: 请教一个自动翻页时跳页的问题 [打印本页]

作者: 一条咸鱼 时间: 2017-9-25 17:00
标题: 请教一个自动翻页时跳页的问题
请教各位大神一个问题：
我用的这个demo：
http://www.swiper.com.cn/demo/23-thumbs-gallery.html加了几个参数，发现页面初始化后，翻页是跳着翻的，就是直接从第一张图跳到了第三张，随便点点之后，又正常了，这个用什么办法解决呀？

以下是我的代码（翻页的按钮挪了位置，没办法，demo要求的）：
<div class="gallery_box">

      <div class="swiper-container gallery-top">
         <div class="swiper-wrapper">
            <div class="swiper-slide slide1" style="background-image:url(res/test_images/1.jpg)"></div>
            <div class="swiper-slide slide1" style="background-image:url(res/test_images/2.jpg)"></div>
            <div class="swiper-slide slide1" style="background-image:url(res/test_images/3.jpg)"></div>
         </div>
      </div>
      <div class="gallery-thumbs-box">
        <div class="swiper-container gallery-thumbs">
         <div class="swiper-wrapper">
            <div class="swiper-slide slide1" style="background-image:url(res/test_images/1.jpg)"></div>
            <div class="swiper-slide slide1" style="background-image:url(res/test_images/2.jpg)"></div>
            <div class="swiper-slide slide1" style="background-image:url(res/test_images/3.jpg)"></div>
</div>
         
         <div class="swiper-button-next"></div>
         <div class="swiper-button-prev"></div>
      </div>
      </div>
</div>

var galleryTop = new Swiper('.gallery-top', {
      spaceBetween: 10,
      loop:true,
      loopedSlides: 5, //looped slides should be the same
      autoplay: 2000
});
var galleryThumbs = new Swiper('.gallery-thumbs', {
nextButton: '.swiper-button-next',
      prevButton: '.swiper-button-prev',
      spaceBetween: 10,
      slidesPerView: 4,
      touchRatio: 0.2,
      loop:true,
      loopedSlides: 5, //looped slides should be the same
      slideToClickedSlide: true,
      autoplay: 2000
});
galleryTop.params.control = galleryThumbs;
galleryThumbs.params.control = galleryTop;

作者: 411377833 时间: 2017-9-28 09:40

这个很不错，谢谢分享

欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/)