Splidejs / splide

Splide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors.
https://splidejs.com
MIT License
4.83k stars 418 forks source link

grid option inside thumbnail slider not working (isNavigation) #1289

Open MiGoep opened 6 months ago

MiGoep commented 6 months ago

Checks

Version

4.0.6

Description

I'm trying to link the grid option with the Thumbnail Slider (isNavigation). The grid works, but the synchronization doesn't. Clicking on the thumbnails does not update the main slider or slide it further.

Could it be that mixing these two options doesn't work?

Reproduction Link

No response

Steps to Reproduce

` var thumbnailSliderSplide = new Splide("#thumbnailSlider", { isNavigation: true, pagination: false, arrows: false, grid: { rows: 2, cols: 6, gap : { row: '0.5rem', col: '0.5rem', } }, }).mount(window.splide.Extensions);

var largeImageSliderSplide = new Splide("#largeImageSlider", { type: "slide", rewind: true, speed: 1000, pagination: false }).sync(thumbnailSliderSplide).mount(window.splide.Extensions); `

I also tried without using "window.splide.Extensions" on largeImageSliderSplide.

Expected Behaviour

Click on the Thumbnail Slider elements should sync with largeImageSliderSplide and go the same index.