獲取瀏覽器以及屏幕的寬度,高度

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高) jquery

 

alert(document.body.clientWidth);        //網頁可見區域寬(body)瀏覽器

alert(document.body.clientHeight);       //網頁可見區域高(body)spa

alert(document.body.offsetWidth);       //網頁可見區域寬(body),包括border、margin等對象

alert(document.body.offsetHeight);      //網頁可見區域寬(body),包括border、margin等文檔

alert(document.body.scrollWidth);        //網頁正文全文寬,包括有滾動條時的未見區域cli

alert(document.body.scrollHeight);       //網頁正文全文高,包括有滾動條時的未見區域scroll

alert(document.body.scrollTop);           //網頁被捲去的Top(滾動條)margin

alert(document.body.scrollLeft);           //網頁被捲去的Left(滾動條)di

alert(window.screenTop);                     //瀏覽器距離Topquery

alert(window.screenLeft);                     //瀏覽器距離Left

alert(window.screen.height);                //屏幕分辨率的高

alert(window.screen.width);                 //屏幕分辨率的寬

alert(window.screen.availHeight);          //屏幕可用工做區的高

alert(window.screen.availWidth);           //屏幕可用工做區的寬

jquery:

 

alert($(window).height());                           //瀏覽器當前窗口可視區域高度

 

alert($(document).height());                        //瀏覽器當前窗口文檔的高度

 

alert($(document.body).height());                //瀏覽器當前窗口文檔body的高度

 

alert($(document.body).outerHeight(true));  //瀏覽器當前窗口文檔body的總高度 包括border padding margin

 

alert($(window).width());                            //瀏覽器當前窗口可視區域寬度

 

alert($(document).width());                        //瀏覽器當前窗口文檔對象寬度

 

alert($(document.body).width());                //瀏覽器當前窗口文檔body的寬度

 

alert($(document.body).outerWidth(true));  //瀏覽器當前窗口文檔body的總寬度 包括border padding margin

相關文章
相關標籤/搜索