Javascript获取屏幕或元素宽与高

获取浏览器屏幕宽度与高度方法一

alert(document.body.clientWidth);       //网页可见区域宽(body)

alert(document.body.clientHeight);       //网页可见区域高(body)

alert(document.body.offsetWidth);       //网页可见区域宽(body),包括border、margin等

alert(document.body.offsetHeight);       //网页可见区域宽(body),包括border、margin等

alert(document.body.scrollWidth);       //网页正文全文宽,包括有滚动条时的未见区域

alert(document.body.scrollHeight);       //网页正文全文高,包括有滚动条时的未见区域

alert(document.body.scrollTop);         //网页被卷去的Top(滚动条)

alert(document.body.scrollLeft);        //网页被卷去的Left(滚动条)

alert(window.screenTop);            //浏览器距离Top

alert(window.screenLeft);            //浏览器距离Left

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

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

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

alert(window.screen.availWidth);        //屏幕可用工作区的宽

获取浏览器屏幕宽度与高度方法二

//JavaScript获取浏览器的高度和宽度,程序代码如下所示
function getBrowser() {
    var w, h;
    w = document.documentElement.clientWidth || document.body.clientWidth;
    h = document.documentElement.clientHeight || document.body.clientHeight;
    return {
        width: w,
        height: h
    };
}
//JavaScript获取浏览器滚动条的位置,程序代码如下所示
function scollPostion() {
    var t, l, w, h;
    if (document.documentElement && document.documentElement.scrollTop) {
        t = document.documentElement.scrollTop;
        l = document.documentElement.scrollLeft;
        w = document.documentElement.scrollWidth;
        h = document.documentElement.scrollHeight;
    } else if (document.body) {
        t = document.body.scrollTop;
        l = document.body.scrollLeft;
        w = document.body.scrollWidth;
        h = document.body.scrollHeight;
    }
    return {
        top: t,
        left: l,
        width: w,
        height: h
    };
}


  • comment评论板