與jQuery

Question

我試圖創建一個爲用戶使窗口小調整其內容的首，並最終下降到只是一個菜單圖標850像素下創建動態表頭。問題在於，頭文件始終是使用當前Jquery代碼加載頁面的最後一件事情。有任何想法嗎？

$(window).bind("resize load",function() { 
    if($(window).width()>1050){ 
     $('.three-head').show(); 
     $('.two-head').css("margin-right","90px"); 
     $('#header').show(); 
     $('.big-head').show(); 
     $('.small-head').hide(); 
    } 
else if($(window).width()<1050 && $(window).width()>850){ 
    $('.two-head').css("margin-right","30px"); 
    $('#header').show(); 
    $('.big-head').show(); 
    $('.small-head').hide(); 
    $('.three-head').hide(); 
    $('.four-head').show(); 
    $('.five-head').show(); 
} 
else if($(window).width()<850){ 
    $('.small-head').show(); 
} 
}); 

Answer 1

把這個代碼

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

，並刪除

$(window).bind("resize load",function() 

是窗口加載後負荷

Answer 2

我會嘗試動態功能.resize（），將要理森你的窗戶。

$(document).ready(function() { 
    $(window).resize(function() { 
     if($(window).width()>1050){ 
      $('.three-head').show(); 
      $('.two-head').css("margin-right","90px"); 
      $('#header').show(); 
      $('.big-head').show(); 
      $('.small-head').hide(); 
     } else if($(window).width()<1050 && $(window).width()>850){ 
      $('.two-head').css("margin-right","30px"); 
      $('#header').show(); 
      $('.big-head').show(); 
      $('.small-head').hide(); 
      $('.three-head').hide(); 
      $('.four-head').show(); 
      $('.five-head').show(); 
     } 
    }); 
}); 

您還可以實現的onLoad功能LIK這樣的：

$('#header').load(function() { 

    YOUR CODE HERE 

)} 

希望這有助於