Swiper: SlideToClickedSlide not working with centeredSlides false

Created on 21 Apr 2018  路  7Comments  路  Source: nolimits4web/swiper

This is a (multiple allowed):

  • [x] bug
  • [ ] enhancement
  • [ ] feature-discussion (RFC)
  • Swiper Version: 4.2.2 (https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.2.2/js/swiper.js)
  • Platform/Target and Browser Versions: Chrome 66, Edge, Firefox 59
  • Live Link or JSFiddle/Codepen or website with isssue: PREFERABLY _(IF YOU WANT YOUR ISSUE TO BE RESOLVED ASAP)_.

What you did

Used the demo HTML for Thumbnailslider. Removed centeredSlides, added slidesPerView1 to galleryslider, added slidesPerView2 to thumbnail slider.

Expected Behavior

Slide to clicked slide

Actual Behavior

Slides to wrong slide, cannot slide to slide 4, or does nothing.

Demo:
https://codepen.io/anon/pen/GdJVjN

Most helpful comment

Thanks for the example @biwerr, works perfect!.
As you I was trying to get control over click and slideChange events and changing the centeredSlides parameter... and it was a nightmare for me!
If it helps... I have done a small modification to do not center the first thumb when you click on the main gallery control (I have commented the control assignment and move the galleries using a function).

https://codepen.io/Abulidei/pen/MBwjLP

All 7 comments

This is because you have different amount of "snaps" on top and bottom sliders. It won't work in this case. Enable centered slides on bottom, or add there one more empty slide, or handle clicks manually

Can you give example?
Swiper slider with horizontal thumbnails centeredSlides:false

@soxepo example is given in codepen link

@biwerr I tell about working example! I have the same problem, with centeredSlides: true - all great, but when it false - have problems ...

@soxepo sorry, my fault.
My first workaround was to listen on 'click' event an call the slideTofunction on the other slideshow. But performance was not good.

At the moment i'm testing virtualTranslatewith manualy initiate css translate, to controll that the first slide and last slide is not centered.

@soxepo: working example, maybe it helps. https://codepen.io/anon/pen/VxpZbE

Thanks for the example @biwerr, works perfect!.
As you I was trying to get control over click and slideChange events and changing the centeredSlides parameter... and it was a nightmare for me!
If it helps... I have done a small modification to do not center the first thumb when you click on the main gallery control (I have commented the control assignment and move the galleries using a function).

https://codepen.io/Abulidei/pen/MBwjLP

Was this page helpful?
0 / 5 - 0 ratings