當窗口大小變小時不尋常的空間

Question

當窗口變小時，它將在視口的右側創建一個巨大的空白區域。我試圖隱藏在主容器和標題中的溢出，沒有任何改變。

直播代碼http://jordan.rave5.com/tmptemp/

jQuery代碼

 // Control Resize 
     $(window).load(function() { 

      var header = $('#header'), 
       imageGrad = $('.image-grad'), 
       image = $('.header-img'), 
       headerBg = $('#header'), 
       headerSource = $('.header-img'), 
       wWidth = $(window).width(); 

      function resizeDiv() { 
       imageGrad.height(image.height()); 
       imageGrad.width(wWidth); 
       headerBg.css({'background-size': + image.width() + 'px ' + image.height() + 'px'}); 
       $(headerBg).blurjs({ 
        source: headerSource, 
        radius: 8, 
        overlay: 'rgba(0,0,0,0.50)' 
       }); 
      } 

      resizeDiv(); 

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

     }); 

Answer 1

你的代碼看看：

wWidth = $(window).width();是當調整窗口大小時調用該函數外定義。這意味着wWidth獲得窗口負載的值，該值永不改變。當您縮小窗口.image-grad會破壞佈局，因爲其寬度始終等於初始窗口大小。
您應該將該行放入resizeDiv()函數中。