Как соединить два thumbs в swiper?

Для объединения двух swiper thumbs в Swiper существует несколько способов. Один из наиболее популярных способов - использование параметра thumbs.swiper при инициализации основного swiper.

Вот пример кода, демонстрирующий объединение двух thumbs в swiper:

// Создаем основной swiper
var mainSwiper = new Swiper('.main-swiper', {
  // Основные настройки swiper
  // ...

  // thumbs параметры
  thumbs: {
    swiper: {
      el: '.thumbs-swiper',
      // Дополнительные параметры для thumbs swiper
      // Например, slidesPerView, spaceBetween и т.д.
    }
  }
});

// Создаем swiper для thumbs
var thumbsSwiper = new Swiper('.thumbs-swiper', {
  // Настройки для thumbs swiper
  // ...

  // thumbs параметры для основного swiper
  thumbs: {
    swiper: mainSwiper
  }
});

В данном коде мы создаем основной swiper с параметром thumbs, в котором указываем объект swiper, который будет использоваться для отображения миниатюр (thumbs). Затем, создаем отдельный swiper для миниатюр и передаем его в параметр thumbs.swiper основного swiper.

Таким образом, при прокрутке основного swiper, миниатюры также будут синхронизированы и меняться соответственно. Важно помнить о корректном подключении библиотеки Swiper и размещении необходимых div элементов в HTML структуре вашего проекта.