2011-11-22 22 views
0

可能重複:
how to get the browser window size without the scroll bars如何使用jquery在瀏覽器內容查看區域周圍添加邊框?

如何把周圍的瀏覽器內容的邊界觀看使用使用jQuery區域?

這裏是我試過..

var $windowW = $(window).width(); 
var $windowH = $(window).height(); 
alert($windowW + " " + $windowH); // THe results are width 1440 and 745 height 
$("body").css("width", $windowW); 
$("body").css("height", $windowH); 
$("body").css("border","1px solid green"); 

我在文件的正文中沒有的元素,我不想讓周圍的1440的寬度和高度的745

一個 綠色邊框

如何在瀏覽器的可視區域周圍添加邊框,使用從$ $ windowW和$ windowH使用jquery的返回值?

+1

也許有第二條寬度線的拼寫錯誤需要一個高度? –

+0

謝謝你,改變第二個寬度到高度。 –

+0

一個小問題,邊框寬度向右滾動。如何在沒有向右滾動的情況下獲得精確的窗口寬度? –

回答

1

正如瓦拉馬斯提到的,你的主要原因似乎是兩次設置寬度時的錯誤。

但是,你也可以簡化代碼有些使用.css()功能的新「地圖」的形式:

$("body").css({ 
    width: $(window).width() - 2, // subtract twice the thickness 
    height: $(window).height() - 2, // of the border from each dimension 
    border: '1px solid green' 
}); 

編輯:看樣子你需要減去邊界的雙寬度你計劃從寬度和高度添加以避免顯示任何滾動條。我不是百分之百地確定這是爲什麼,或者如何避開它,但是這與邊界增加身體寬度的事實有關,所以你需要彌補這一點。上面的代碼已經改變,以說明我的意思。

4

可以使用CSS和絕對定位更容易做到這一點:

body 
{ 
    border: 2px solid green; 
    position: absolute; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    overflow: auto; 
} 

看到這個fiddle

+0

這個設置四邊的絕對位置的東西非常有用。好的解決方案 –

相關問題