jQuery的顯示（）隱藏（）加載頁

Question

我試圖使用功能顯示或隱藏這樣的負荷頁：

 $(window).resize(function(){ 
     var width = $(window).width() 

     if(width >= 1200) { 
      console.log("> 1200") 

      $('#acct').attr({ 
       'style' : 'display: none;', 
      }); 

      $("#logout").css('display', 'none'); 
      $("#dropnav").show(); 
      $("#icontop").show(); 
      $('.navbar-default').css("max-height", "50px"); 
      $('#meetus').css("margin-left", "-100px"); 
     } else { 
      $("#acct").show(); 
      $("#logout").show(); 
      $("#icontop").hide(); 
      $("#dropnav").hide(); 
      $('.navbar-default').css("max-height", "999999px"); 
      $('#meetus').css("margin-left", "-60px"); 
     } 
    }); 

，當我與機能的研究調整大小（）的頁面隱藏運行和顯示組件攜手perfetly，但在文件準備就緒，歐窗口負載沒有任何反應:(

Answer 1

這是因爲$(window).resize()不叫在頁面加載

重構的代碼放到一個單獨的功能：

function resizer(){ 
     var width = $(window).width() 

     if(width >= 1200) { 
      console.log("> 1200") 
      $('#acct').attr({ 
       'style' : 'display: none;', 
      }); 
      $("#logout").css('display', 'none'); 
      $("#dropnav").show(); 
      $("#icontop").show(); 
      $('.navbar-default').css("max-height", "50px"); 
      $('#meetus').css("margin-left", "-100px"); 
     } 
     else { 
      $("#acct").show(); 
      $("#logout").show(); 
      $("#icontop").hide(); 
      $("#dropnav").hide(); 
      $('.navbar-default').css("max-height", "999999px"); 
      $('#meetus').css("margin-left", "-60px"); 
     } 
} 

然後調用它resize和ready：

$(document).ready(function(){ 
    resizer(); 
}); 

$(window).resize(function(){ 
    resizer(); 
});