@Evtera

Как отключить swiper на определенном разрешении экрана? Как внутри слайда интегрировать таб, который увеличивает высоту слайда?

Здравствуйте. Есть слайдер на базе swiper. По сути, там один большой слайдер, и внутри последнего слайдера встроен другой слайдер.

1) Не могу понять, как отключить оба слайдера при определенном breakpoint
2) и как во втором внутреннем слайдере реализовать функцию, когда будут подгружаться картинки, тем самым увеличивая высоту слайдера. В настоящий момент, при подгрузке всё ломается, даже не смотря на observe.

var mainSwiper = new Swiper(".main-slider", {
  slidesPerView: 1,
  mousewheel: true,
  observer: true,
  observeSlideChildren: true,
});

var innerSwiper = new Swiper(".second-slider", {
  direction: "vertical",
  mousewheel: true,
  freeMode: true,
  nested: true,
  observer: true,
  observeParents: true,
  autoHeight: true,
  slidesPerView: "auto",
  scrollbar: {
    el: ".swiper-scrollbar",
    draggable: true,
    hide: false,
  },
});

const changeDirection = (slider) => {
  window.innerWidth <= 1024 ? slider.destroy(true, true) : slider.init();
};

window.addEventListener("resize", () => {
  changeDirection(innerSwiper);
  changeDirection(mainSwiper);
});

changeDirection(mainSwiper);
changeDirection(innerSwiper);


  • Вопрос задан
  • 1078 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы