Evolutio Evolutio - 9 days ago 5
jQuery Question

SwiperSlider, Gallery with thumbs and loop enabled breaks SwiperSlider completly

SwiperSlider breaks with loop: true and thumbs enabled.

my code is this:

var galleryTop = new Swiper('.gallery-top', {
spaceBetween: 15,
slidesPerView: 2,
centeredSlides: true,
loop: true
});

var galleryThumbs = new Swiper('.gallery-thumbs', {
spaceBetween: 10,
centeredSlides: true,
slidesPerView: 'auto',
touchRatio: 0.2,
slideToClickedSlide: true,
loop: true
});

galleryTop.params.control = galleryThumbs;
galleryThumbs.params.control = galleryTop;


a working example of the problem is here: http://jsfiddle.net/00gz8gLd/12/

I didn't expect the result with loop: true, when I set it to false, the slider works great.

Does anyone have a solution for this?

Answer

I found the solution:

for gallery-top:

loopedSlides: $('.gallery-top .swiper-wrapper .swiper-slide').length

for gallery-thumbs:

loopedSlides: $('.gallery-thumbs .swiper-wrapper .swiper-slide').length