ブラウザのサイズ変更時にサイドメニューを非表示にする

Question

ユーザーがリンクの「目次」をクリックすると、サイドメニューとして表示されます。 ブラウザのサイズが1448px未満になると、サイドメニューはfadeOut（）を実行します。その後、1448pxの上にリサイズ1448px以下のブラウザのサイズを変更するリンク、「目次」をクリックした後...

がどのように私は再び）自動的にフェードイン（にサイドメニューを得ることができるので、

、？

var button = $("a#contents_link"); // the TOC link 
    var toc = $('#table-of-contents'); // the TOC div to show 
    var browser = $(window);   // getting the browser width 


    toc.hide();       // hide the TOC div upon loading the page 

    button.click(function (event) { // toggling the TOC div 
     toc.fadeToggle(300); 
     event.preventDefault(); 
    }); 

    $(browser).resize(function() { 
     if ((toc.is(':visible')) && (browser.width() >=1449)) { 
      toc.fadeIn(); 
     } else if((toc.is(':visible')) && (browser.width() <=1448)){ 
      toc.fadeOut(); 
     } 
    }); 

Answer 1

最初のIFステートメントでTOCの可視性を確認するコードと混同しています。これを書き直すべきではありません：

$(browser).resize(function() { 
    if ((toc.is(':hidden')) && (browser.width() >=1449)) { 
     toc.fadeIn(); 
    } else if((toc.is(':visible')) && (browser.width() <=1448)){ 
     toc.fadeOut(); 
    } 
});