關于獲取各種瀏覽器可見窗口大小的一點點研究
<script>
function getinfo()
{
var s = "";
s += " 網頁可見區域寬："+ document.body.clientwidth;
s += " 網頁可見區域高："+ document.body.clientheight;
s += " 網頁可見區域寬："+ document.body.offsetwidth + " (包括邊線和滾動條的寬)";
s += " 網頁可見區域高："+ document.body.offsetheight + " (包括邊線的寬)";
s += " 網頁正文全文寬："+ document.body.scrollwidth;
s += " 網頁正文全文高："+ document.body.scrollheight;
s += " 網頁被卷去的高(ff)："+ document.body.scrolltop;
s += " 網頁被卷去的高(ie)："+ document.documentelement.scrolltop;
s += " 網頁被卷去的左："+ document.body.scrollleft;
s += " 網頁正文部分上："+ window.screentop;
s += " 網頁正文部分左："+ window.screenleft;
s += " 屏幕分辨率的高："+ window.screen.height;
s += " 屏幕分辨率的寬："+ window.screen.width;
s += " 屏幕可用工作區高度："+ window.screen.availheight;
s += " 屏幕可用工作區寬度："+ window.screen.availwidth;
s += " 你的屏幕設置是 "+ window.screen.colordepth +" 位彩色";
s += " 你的屏幕設置 "+ window.screen.devicexdpi +" 像素/英寸";
//alert (s);
}
getinfo();
</script>
在我本地測試當中：
在ie、firefox、opera下都可以使用
document.body.clientwidth
document.body.clientheight
即可獲得，很簡單，很方便。
而在公司項目當中：
opera仍然使用
document.body.clientwidth
document.body.clientheight
可是ie和firefox則使用
document.documentelement.clientwidth
document.documentelement.clientheight
原來是w3c的標準在作怪啊
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
如果在頁面中添加這行標記的話
在ie中：
document.body.clientwidth ==> body對象寬度
document.body.clientheight ==> body對象高度
document.documentelement.clientwidth ==> 可見區域寬度
document.documentelement.clientheight ==> 可見區域高度
在firefox中：
document.body.clientwidth ==> body對象寬度
document.body.clientheight ==> body對象高度
document.documentelement.clientwidth ==> 可見區域寬度
document.documentelement.clientheight ==> 可見區域高度
?
在opera中：
document.body.clientwidth ==> 可見區域寬度
document.body.clientheight ==> 可見區域高度
document.documentelement.clientwidth ==> 頁面對象寬度（即body對象寬度加上margin寬）
document.documentelement.clientheight ==> 頁面對象高度（即body對象高度加上margin高）
而如果沒有定義w3c的標準，則
ie為：
document.documentelement.clientwidth ==> 0
document.documentelement.clientheight ==> 0
firefox為：
document.documentelement.clientwidth ==> 頁面對象寬度（即body對象寬度加上margin寬）document.documentelement.clientheight ==> 頁面對象高度（即body對象高度加上margin高）
opera為：
document.documentelement.clientwidth ==> 頁面對象寬度（即body對象寬度加上margin寬）document.documentelement.clientheight ==> 頁面對象高度（即body對象高度加上margin高）
真是一件麻煩事情，其實就開發來看，寧可少一些對象和方法，不使用最新的標準要方便許多啊。
新聞熱點
疑難解答
