Как перезапустить инициализацию Swiper Slider?
На странице, есть Swiper Slider И после перезагрузки контента с помощью Ajax, слайдер перестает работать. Так как там полностью заменился блок. Как переприсвоить этот блок для слайдера или же перезапустить слайдер вовсе. Код свайпера не мой, он там очень большой *8600 строчек. Пробовал просто создать новый слайдер, но там он в модулях и ругаеться на неизвестные функции. Могу дать ссылку на сам сайт или же прикрепить код. Как лучше?
Ответы (2 шт):
Насколько я понял "полностью заменился блок" означает, что объекту Swiper был назначен другой элемент в DOM. Возможно Вам поможет метод update():
mySwiper.update()
Чтобы исправить эту проблему, вам нужно будет перезапустить Swiper Slider после перезагрузки контента с помощью Ajax. Одним из способов это сделать является переинициализация слайдера, удалив существующую инстанцию Swiper, а затем создав новую.
Вот пример того, как это можно сделать:
var mySwiper = new Swiper('.swiper-container', {/* настройки слайдера */});
// вызов AJAX запроса
// после успешного запроса переинициализируйте слайдер
mySwiper.update();
Этот код пересоздаст экземпляр слайдера с новым контентом. Обратите внимание, что вы можете нужно будет указать настройки слайдера заново, если они были изменены с момента создания слайдера.
Чтобы перезапустить инициализацию Swiper Slider, вам нужно будет сначала удалить текущий экземпляр слайдера, а затем создать новый экземпляр с нужными настройками. Это можно сделать с помощью следующего кода:
// сначала удаляем текущий экземпляр слайдера
mySwiper.destroy();
// теперь создаем новый экземпляр слайдера
mySwiper = new Swiper('.swiper-container', {/* настройки слайдера */});
Обратите внимание, что вам нужно будет указать настройки слайдера заново, если они были изменены с момента создания слайдера.