レスポンシブなサイドバータブとクリックイベントトグル

Question

小さな画面サイズのタブに変換するサイドバーがあります。これは主にCSSを使用して行われ、JavaScriptを使用してタブを開いたり閉じたりします。タブが開いているときは、ユーザーが画面上の任意の場所をクリックして閉じることができるようにしました。

私のresize（）関数は、タブをサイドバーに戻しますが、ユーザーが小さいサイズでタブをクリックすると、ブラウザが拡大され、画面のどこかをクリックするとサイドバーが消えます。

基本的に、私ができるようにする必要があるすべては、私はjQueryの「.off」機能を使ってみました

if($(window).width() > 751 
{ 
    {remove the event set up in $(document).click(function(e)} 
} 

のようなものを私はここで設定したのonclickを削除することです。伝播を停止 - 何も動作していないようです。正しい構文であっても、私はオフフックを行うことはできません。私は、もちろん、私がしたくないイベントのクリックを無効にするかもしれないと思う。物事はちょうどこのコードは、任意の画面サイズで正常に動作し、画面サイズが大きいより751

<script type="text/javascript"> 
    $(document).ready(function() 
    { 
     $('#SideTab').click(function() 
     { 
      // Actual width is 340, allowing for tab (#SideTab) to show 
      // Toggle Sidebar open or closed 
      if($('#Sidebar1').css('margin-left') != '-300px') 
      { 
       $('#Sidebar1').css('margin-left', '-300px'); 
      } 
      else 
      { 
       // At 0px, Sidebar is showing 
       // Event handler allows for Sidebar to close when item on 
       // Sidebar is clicked, as well as anywhere outside of 
       // Sidebar. 
       $('#Sidebar1').css('margin-left', '0px'); 
       $(document).click(function(e) 
       { 
        if(!($(e.target).is("#Sidebar1") || $(e.target).closest("#Sidebar1").length) || $(e.target).is(".cbp-filter-item")) 
        { 
         // Hide Sidebar 
         $('#Sidebar1').css('margin-left', '-300px'); 
        } 
       }); 
      } 
     }); 
     $(window).resize(function() 
     { 
      if($(window).width() > 751) 
      { 
       $('#Sidebar1').css('margin-left', '0px'); // Show Sidebar 
      } 
      else 
      { 
       $('#Sidebar1').css('margin-left', '-300px'); // Hide Sidebar 
      } 
     }).resize(); 
    }); 
</script> 

ただ、繰り返しになるにリサイズされたときに通常の状態に戻る必要があります。この問題は、ユーザーが小さな画面サイズでタブをクリックし、サイドバーがアクティブな場所（余白 - 左：0）に画面のサイズを変更したときに発生します。このような状況では、画面のどこかをクリックするとサイドバーが消えます。サイドバーは、画面サイズ> 751のときに常に表示されます。

Answer 1

これは非常に簡単でした。なぜこれが1応答なしでここに座ったのか分からない。 （今それはそう、答えはかなり明白だったが。） は単に

if(($(window).width() < 752) && (!($(e.target).is("#Sidebar1") || $(e.target).closest("#Sidebar1").length) || $(e.target).is(".cbp-filter-item")))