調整div來填充屏幕的100％，而不是滾動條

我得到了一個菜單在我的150px高的標題左下方，我試圖讓菜單填充屏幕的剩餘空間高度沒有得到一個滾動條。調整div來填充屏幕的100％，而不是滾動條

目前我得到了下面的腳本。減去從DIV菜單：

$(document).ready(function(){ 
    $(window).resize(function(){ 
     $('#left_menu').height($(window).height() - 150 + 'px'); 
     $('.inner_contentwrapper').height($(window).height() - 150 + 'px'); 
    }); 
});

當我刷新頁面菜單仍然strechted太遠，但如果我打開Firebug，並關閉它的兩個div調整滾動條消失。

有人知道如何使頁面加載運行？

來源

2012-02-09 ffffff01

是否有一個原因，你不這樣做的樣式？ – 2012-02-09 17:37:55

當他們不知道什麼#left_menu和.inner_contentwrapper是...我建議創建一個jsfiddle與你的問題，任何人都能夠幫助你。但乍一看，你似乎將兩個元素放在同一高度。 – TigOldBitties 2012-02-09 17:38:21

問題是，我的頁面頂部有一個頁眉，當我使用height：100％時，菜單太長。菜單太長..它在瀏覽器窗口之外，我得到一個滾動條。 – ffffff01 2012-02-09 18:38:44

這是工作後，你打開螢火蟲B/C的窗口正在調整大小。在你的代碼中，當文檔準備就緒時，你永遠不會調用你的調整大小。我想你真的想要：

var reHeight = function(){ 
    $('#left_menu').height($(document).height() - 150 + 'px'); 
    $('.inner_contentwrapper').height($(document).height() - 150 + 'px'); 
} 
$(document).ready(function(){ 
    $(window).resize(reHeight); 
    reHeight(); 
});

來源

2012-02-09 18:49:04 rgthree

謝謝。這工作！ – ffffff01 2012-02-09 19:20:36

你可以嘗試改變你不想要滾動條的div的CSS。這樣

$('#left_menu').css('overflow', 'visible')

來源

2012-02-09 17:39:03 Marc

你可以立足新的大小關窗的大小不是文件大小（這可能會比你的窗口大）

$(document).ready(function(){ 
    $(window).resize(function(){ 
    $('#left_menu').height($(window).height() - 150 + 'px'); // why are you subtracting 150? might want to remove that... 
    $('.inner_contentwrapper').height($(window).height() - 150 + 'px'); 
    }); 
})

;

來源

2012-02-09 17:43:17 ehudokai

嗯，stille同樣的問題..它工作後，我打開螢火蟲..我減去150px，因爲我的頂部標題是150px的高度。 – ffffff01 2012-02-09 18:36:36

調整div來填充屏幕的100％，而不是滾動條

回答

相關問題