画面のサイズ変更時にflickityを使用しようとしました

Question

次のjqueryコードは、画面サイズが小さくなったときに私のdivにflickityスライダを適用するために使用しています。 （：記事クラス）

ここ

(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); 

は、コンテナがdivをラップしたクラスですが、機能していない、これは...このコードで間違っているものを私に教えてください。以下はギャラリーとギャラリーセルの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

これを確認するには、デフォルトのフリックオプションを使用する必要があります。

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

// 768px

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

で前/次のボタンを有効にします