Вызов скрипта при определенном разрешении

Question

Как изменить условия скрипта, что бы он вызывался при мобильном разрешении ?

    if ($(".about-reasons__slider3").length > 0) {
    var aboutReasonsSlider1 = new Swiper(".about-reasons__slider3", {
    slidesPerView: 4,
    spaceBetween: 30,
    allowTouchMove: true,
    speed: 800,
    loop: true,
    autoplay: {
      delay: 5000
    },
    pagination: {
      el: ".about-reasons__pagination",
      type: "bullets",
      clickable: true,
      bulletActiveClass: "isActive"
    },
    navigation: {
      nextEl: ".about-reasons__nav3 .-next",
      prevEl: ".about-reasons__nav3 .-prev",
    }
  });
}

//Мобильная версия 
if ($(".about-reasons__slider3").length < 768) {
var aboutReasonsSlider1 = new Swiper(".about-reasons__slider3", {
    slidesPerView: 2,
    slidesPerColumn: 2,
    spaceBetween: 30,
   
    pagination: {
      el: ".about-reasons__pagination",
      clickable: true,
     
    },
    navigation: {
      nextEl: ".about-reasons__nav3 .-next",
      prevEl: ".about-reasons__nav3 .-prev",
    }
  });
}

Answer 1

Если делать это с помощью css если я правильно понял и тебе нужно что бы слайдер появился то можно изначально задать ему display:none а при определенном разрешении с помощью media запроса дать ему например display:block. Есть вариант сделать это на js с помощью innerWidth например `

if (window.innerWidth < 500) {

  // сюда пишешь свой код

}

`

БЛОГ НА HUSL

Вызов скрипта при определенном разрешении

Ответы (1 шт):