Установите для ложной анимации слайдов флекслайдера только при ширине экрана менее 780 пикселей

Быстрый маленький вопрос:

Как отключить анимацию слайдов на гибком слайдере ТОЛЬКО при ширине экрана менее 780 пикселей?

Любой умный легкий JavaScript, который я могу добавить?

Возможно нацелиться на слайд-шоу: правда только тогда, когда в этом конкретном размере экрана?

Спасибо заранее и хорошего дня всем ^.^

  $(document).ready(function() {
        $('.flexslider').flexslider({
            animation: "slide",
            controlNav: false,
            animationLoop: true,
            slideshow: true               
        });

   });

Может быть, добавив что-то вроде:

  $(window).width(780) {
        $('.flexslider').flexslider({
            slideshow: false

        });

но приведенная выше попытка кажется неверной. Если бы кто-то мог поделиться немного света <3

1 ответ

Решение

Я бы использовал matchMedia для этого и настроил слушателя, когда размер экрана перемещается выше / ниже порога 780 пикселей.

var query = window.matchMedia("(max-width: 780px)");
query.addListener(mediaChange);

function mediaChange(query) {
  if(query.matches) {
    //We are 780px or below, disable flexslider animation
    $('.flexslider').flexslider({slideshow: false});
  } else {
    //We are above 780px, enable flexslider animation
    $('.flexslider').flexslider({slideshow: true});
  }
}
Другие вопросы по тегам