Intentando hacer un carrusel simple con un carrusel de pulgares asociado debajo:
// Thumbs const galleryThumbs = new Swiper(thumbsElement, { spaceBetween: 10, slidesPerView: 4, scrollbar: true, breakpoints: { 768: { slidesPerView: 8, }, }, }); // Slides const galleryTop = new Swiper(top, { spaceBetween: 10, effect: "fade", loop: true, navigation: { nextEl: ".swiper-button-next", prevEl: ".swiper-button-prev", }, multipleActiveThumbs: false, thumbs: { swiper: galleryThumbs, }, });Esto funciona como se describe, pero tengo un problema:
Cuando uno se desplaza a la siguiente imagen usando las flechas de navegación, y la miniatura correspondiente está fuera de la vista, las miniaturas se desplazan en grupo (en la cantidad descrita en la configuración slidesPerView ). Estoy buscando una manera de que se desplace solo uno por uno, como lo hace cuando se desplaza con la flecha hacia atrás.