小さな画面でブートストラップの「接写」を無効にするにはどうしたらいいですか？

Question

私はnavbar用のサイトで接尾辞コンポーネントを使用しており、小さな画面でそれを無効にしたいと考えています。私はjqueryメソッドとデータを使用しているので、画面の解像度が767pxよりも小さい場合は、それをオフにする方法を理解できません。私はサイズ変更とスクロールでウィンドウの幅をキャプチャしようとしたか、falseを返すか、接写クラスを削除するかのどちらかがうまくいきません。

if($('#subnav').length){ 

    $(window).resize(function() { 
     var wWidth = $(window).width(); 
     getSize(wWidth); 
    }); 

    $(window).scroll(function() { 
     var wWidth = $(window).width(); 
     getSize(wWidth); 
    }); 

    function getSize(z){ 
     if(z <= 767) { 
        // I tried doing return false here, no good. 
      $('#subnav').removeClass('affix').removeClass('affix-top'); 
      $('.nav > li').removeClass('active'); 
     } else { 
      setNav(); 
     } 
    } 

    var wWidth = $(window).width(); 
    getSize(wWidth); 

    function setNav(){ 
     $('#subnav').affix({ 
      offset: { 
      top: 420, 
      bottom: 270 
      } 
     }); 
     $('#subnav').scrollspy(); 
    } 

} 

Answer 1

これは、ブートストラップページと同じように、CSSだけでも実行できます。画面のサイズを検出する場合は@media queriesを使用し、画面が一定サイズ以下の場合はfixedに設定しないでください。例：

@media (min-width: 768px) { 
    .affix { 
     position: fixed; 
    } 
} 

このルールは、画面の幅が768pxを超える場合にのみ有効です。

また、その逆にそれを行う画面が一定のサイズよりも小さくされている場合staticに明示的要素の位置を設定することができます。

​​3210

Answer 2

は私が間違っているなら、私を修正しますが、if(z <= 1) {に、それはサイズ直しをしませんそのようにif(z <= 767) {を設定してみてください？あなたの質問のポイントを紛失していない限り。