пытается использовать мерцание при изменении размера экрана

Question

следующий код jquery - это тот, который я использую для применения слайдера flickity для моих divs при уменьшении размера экрана! но это не работает ... скажите, пожалуйста, что не так с этим кодом:

(function($) { 
    $(window).resize(function resize(){ 
     if ($window.width() < 700) { 
      $(".container").addClass('gallery').addClass('js-flickity'); 
      $(".article").addClass('gallery-cell'); 
     } 

     $(".container").removeClass('gallery').removeClass('js-flickity'); 
     $(".article").removeClass('gallery-cell'); 
    }).trigger('resize'); 
})(jQuery); 

Здесь, контейнер класс, который оборачивает дивы (класс: статья). следующее: css для галереи и галереи-ячейки:

.gallery { 
    background: #EEE; 
} 

.gallery-cell { 
    width: 100%; 
    height: 200px; 
    margin-right: 10px; 
    background: #8C8; 
    counter-increment: gallery-cell; 
} 

/* cell number */ 
.gallery-cell:before { 
    display: block; 
    text-align: center; 
    content: counter(gallery-cell); 
    line-height: 200px; 
    font-size: 80px; 
    color: white; 
} 

Пожалуйста, сообщите мне о проблеме с кодом. Спасибо

Answer 1

, насколько я понимаю ваш код это выглядит следующим образом:

если window.width < 700 добавить некоторые классы затем удалить классы, которые вы, вероятно, только что добавили

ваш код всегда удаляет классы ! : D

Answer 2

Проверьте это, вы должны использовать опцию Flickity по умолчанию.

http://codepen.io/desandro/pen/xVBpqG

// включить prev/next на 768px

if (matchMedia('screen and (min-width: 768px)').matches) { 
    options.prevNextButtons = true; 
}