Tagged: swiper

11
Июн
2021

Не работает цикл, swiper js

Я хочу чтобы навигационное меню работало от цикла, но цикл не работает:
for(var index = 0; index < menuLinks.lenght; index++) {
const menuLink = menuLinks[index];
menuLink.addEventListener("click", function(e) {

11
Июн
2021

Не работает цикл, swiper js

Я хочу чтобы навигационное меню работало от цикла, но цикл не работает:
for(var index = 0; index < menuLinks.lenght; index++) {
const menuLink = menuLinks[index];
menuLink.addEventListener("click", function(e) {

01
Июн
2021

Как связать между собой слайдеры swiper.js?

Как связать между собой 3 слайдера, что бы при перетаскивании одного слайдера, вместе с ним синхронно двигались другие. Заранее спасибо.
Знаю как связать два слайдера
quoteSwiper.params.control = imageSwiper;
imageSwiper.params.control = q…

01
Июн
2021

Как связать между собой слайдеры swiper.js?

Как связать между собой 3 слайдера, что бы при перетаскивании одного слайдера, вместе с ним синхронно двигались другие. Заранее спасибо.
Знаю как связать два слайдера
quoteSwiper.params.control = imageSwiper;
imageSwiper.params.control = q…

23
Май
2021

При использовании табов вместе со слайдером возникают проблемы

Подскажите почему при использовании табов бутстрап вместе со слайдером свайпер , слайдеры ведут себя странно. При переключении табов слайдер не управляется стрелочками + мышкой перелистывается с какими-то зависаниями. В чем проблема. Начин…

18
Май
2021

Swiper текущий слайд в тубме

Нужно что бы при переключения слайдера, тумба перелистывалась и первым становился текущий слайд
Пример на фото
[1]: https://i.stack.imgur.com/DymGH.png
Нужно что бы на место первого слайда стал второй

16
Май
2021

Как сделать чтобы swiper скролил не только слайды а и содержимое в них?

Есть у меня полноэкранный слайдер, я настроил для него переключение колесеком, тоесть, кручу колесо, переключаются слайды вниз или вверх, но на например на ноутбуках содержимое слайдов не влазит в высоту, я это предусмотрел и дал слайдам o…

07
Май
2021

Как в Swiper изменить поведение параметра slidesPerGroup?

Есть, например, 10 слайдов, параметр slidesPerView равен 4, slidesPerGroup тоже равен 4.
Когда изначально нажимаешь на кнопку "Вперед", то прокручиваются 4 слайда, потом те 2 слайда, которые остались.
Но если нажимаешь кнопку &qu…

17
Апр
2021

Как сделать переход на первое фото категории в Swiperjs

Есть слайдер в нем есть 2 категории картинок у одних будет атрибут Экстерьер у других Интерьер
(возможно есть вариант иначе их делить нежели задавать каждой картинке атрибут). Долистывая до фоток другой категории у нас меняется подсветка …

15
Апр
2021

Как правильно сверстать такой слайдер?

Я начинающий верстальщик, пытаюсь сверстать слайдер с текстом, как показано на схеме ниже, однако как-бы я не пробовал, постоянно какие-то косяки. То слайдер выходит за линию .container, то наоборот страница масштабируется, но слайдер обре…

14
Апр
2021

Swiper API: Как пролистывать элементы по одному, а не целой группой элементов, но при нажатии на буллеты – группу элементов?

Всем привет, столкнулся с такой проблемой, где требуется при нажатии на стрелку пролистывать элементы по одному, а не целой группой элементов. При этом, буллеты должны пролистываться группой элементов.
HTML-разметка:
<!– Slider main co…

14
Апр
2021

Swiper API: Как пролистывать элементы по одному, а не целой группой элементов, но при нажатии на буллеты – группу элементов?

Всем привет, столкнулся с такой проблемой, где требуется при нажатии на стрелку пролистывать элементы по одному, а не целой группой элементов. При этом, буллеты должны пролистываться группой элементов.
HTML-разметка:
<!– Slider main co…

30
Мар
2021

Ошибка history.js, Swiper

Использую Swiper на сайте и все было хорошо, но сейчас появилась такая ошибка в консоле и сам слайдер сломался

29
Мар
2021

Свайпер обрезает часть блока, которая должна остаться

У swiper-container по умолчанию стоит overflow: hidden;. Из-за этого он обрезает часть слайдов по оси-Y. Если я поменяю на overflow: visible;, то по оси-Y будет всё ок, а вот по оси-X будет видна часть следующего блока.
Сам вопрос: Как сде…

26
Мар
2021

Swiper. Если убрать centeredSlides слайдер не корректно работает, почему так происходит и как можно решить эту проблему?

Если убрать centeredSlides то после пары циклов прокрутки слайдера вы увидите как он прыгает, так же происходят не понятные вещи когда нажимаешь несколько раз подряд на крайний правый слайд он прокручивается то в одну сторону то в другую, …

24
Мар
2021

Swiper галерея с навигацией универсальная, на одной странице много галерей

Подскажите как можно реализовать Swiper галерею универсальную, точней как можно написать код на JS чтобы он подходил для всех галерей. Галерея состоит из слайдера и навигации сладов.
Пример, есть галерея и нужно эту галерею сделать на одн…

01
Мар
2021

Почему в swiper js не работают меттоды observer, observeParents, observeSlideChildren?

Спрятал я слайдер состоящий из одного скрола в меню в итоге если при первом открытие меню даные методы не срабатываю, а при последующих теряется drag. Тут казус изатого что я вставил в html подключение к сваиперу даный код не будет робить …

01
Мар
2021

Как сделать анимацию приближения и отдаления фона css для слайдера swiper?

Пробовал делать анимацию для слайдера swiper, но слайдер почему-то ломался при добавлении анимации. Также помимо фона, анимация была применена и на само содержимое слайда.
(Картинки взяты для примера)
Код HTML:
<div class="swip…

28
Фев
2021

Как присвоить высоту одного элемента к другим элементам на чистом JS?

Как мне через vanilla js получить высоту самого высокого элемента слайдера и присвоить его к остальным, чтобы по итогу была одна высота для всех?
На сайте использовался swiper-слайдер, при добавлении в него картинок разного размера они рас…

23
Фев
2021

Из-за autoplay престает работать слайдинг после открытия большей версии слайдера

У меня есть слайдер, и когда я кликаю по одному из изображений в нем, большой слайдер, содержащий те же изображения создается и отображается на странице, а все остальные элементы скрываются.
Но если я кликаю именно по первому изображению п…