Как отключить слайдер на большем разрешении?

Question

[Антон M]

Слайдер не нужен на разрешении от 750px.

В документации написано о breakpoints. Получается отобразить все нужные слайды на данном разрешении командой slidesPerView: 4. Тогда встаёт вопрос как заблокировать слайды, чтобы их невозможно было листать.

Comments

[Kovalsky]

Как осуществляется переключение слайдов - с помощью кнопок навигации или свайпом?

[Антон M]

И кнопками, и свайпом.

Answer 1

[Александр Шакиров]

Как вариант можно отслеживать ресайз окна и если надо то делаем destroy, либо если нужен слайдер (и он не создан) - создаем.

Answer 2

[alexandzolotarev]

MySwiper.destroy (deleteInstance, cleanupStyles);
idangero.us/swiper/api

Comments

[Антон M]

я знаю об этом методе, но не понимаю куда его писать(

[Иван]

Bluorenge: но скорее всего вызывать его надо когда у экрана будет подходящая разрешение

[Антон M]

breakpoints: {
// when window width is <= 749px
749: {
slidesPerView: 1,
},
// when window width is <= 960px
960: {
slidesPerView: 4,
swiper.destroy(false)
}
}
когда пишу так, слайдер ломается на всех разрешениях

[Иван]

Bluorenge: mySwiper.destroy(false)

[Антон M]

Иван: mySwiper - это название переменной. У меня она называется просто swiper.

[alvvi]

Bluorenge: еще бы он не сломался, вы пытаетесь внутри объекта вызвать функцию :)

[alvvi]

Bluorenge: вам нужно самому отследить брейкпоинты с помощью window.innerWidth или window.matchMedia или любым другим способом и вызвать что-то типа

slider.initialized ? slider.destroy() : slider.initialize(options);

(это псевдокод, я плохо помню API Swiper'a, но суть должна быть ясна)