¿Cómo podemos construir 2 carruseles sincronizados usando el módulo Thumbs ?
Observe que las miniaturas se mueven al mover el control deslizante principal y la miniatura activa siempre está centrada.
Antes del módulo Thumbs, usábamos el módulo Controller, pero en Swiper 8 no funciona como se esperaba. Aquí hay un ejemplo de cómo funcionaba antes.
Mi código real para iniciar los controles deslizantes es el de la demostración oficial, pero los controles deslizantes no se mueven juntos
let swiperThumbs = new Swiper(".mySwiper", { modules: [Thumbs, Controller], centeredSlides: true, slideToClickedSlide: true, loop: true, slidesPerView: 5, }); let swiperSlider = new Swiper(".mySwiper2", { modules: [Thumbs, Navigation, Controller], centeredSlides: true, slidesPerView: 1, loopedSlides: 6, loop: true, navigation: { nextEl: ".mySwiper2 .swiper-button-next", prevEl: ".mySwiper2 .swiper-button-prev", }, thumbs: { swiper: swiperThumbs, }, });También probé estas líneas pero no funcionan:
swiperSlider.thumbs.swiper = swiperThumbs; swiperThumbs.thumbs.swiper = swiperSlider;