Почему у меня неправильно работает swiper слайдер?

Question

[Genri_Rus]

Вот пример: https://codepen.io/Genri_Rus/pen/RwwzgLW

Когда я скролю картинки, то в один момент у меня миниатюры дальше не хотят скролиться

Comments

[z_u_l]

Потому что вы долистываете до последнего слайда. А по умолчанию у всех слайдеров loop: false.
Соответственно нужно слайдерам поставить loop: true,

[Genri_Rus]

z_u_l, я поставил, но стало еще хуже: https://codepen.io/Genri_Rus/pen/RwwzgLW

[Genri_Rus]

z_u_l, что нужно еще добавить ?

[z_u_l]

Genri_Rus, смотрите, https://codepen.io/malinosky/pen/PoorLBG
обновил версию swiper'a, у вас 4, а свежайшая 5 (не знаю, критично ли для вашего проекта, но в 4 версии есть траблы с подобными галереями, которые в 5 версии поправили в том числе и зацикливаение, если не ошибаюсь). Сейчас все работает зациклено, вам остается только поправить на active css класс, чтоб у thumbs'ов активный элемент отображался.

[Genri_Rus]

z_u_l, спасибо за помощь, по-умолчанию же стоит active ?

[z_u_l]

Genri_Rus, Должно быть

.gallery-thumbs .swiper-slide-thumb-active {
opacity: 1;
}

[Genri_Rus]

z_u_l, а может вы знаете как убрать пустоту между картинками ?


Вот пример: https://codepen.io/Genri_Rus/pen/bGGXNWv

[z_u_l]

Genri_Rus, как вариант, .gallery-thumbs задать высоту 300px. Или менять количество итемов в galleryThumbs. Но задать высоту все равно нужно

[Genri_Rus]

z_u_l, я поменял, но теперь вот так: https://codepen.io/Genri_Rus/pen/bGGXNWv

[z_u_l]

У меня так. Вы можете тоже ограничить слайдер, который слева, если речь про это

[Genri_Rus]

z_u_l, ну а как мне увеличить ширину миниатюры и чтобы она была по середине ?