一个分享个人学习、开发经验的Blog,http://www.joyphper.net

javascript 获取当前页面可视高度和宽度及浏览器宽度和高度的函数

posted @ 2010-10-05 15:56 | 阅读:7835 | 评论:0 | 分类: Javascript

javascript 得到当前页面可视高度和宽度

 

function getHeight(){  
 
    var yScroll;  
 
    if (window.innerHeight && window.scrollMaxY) {  
        yScroll = window.innerHeight + window.scrollMaxY;  
    } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac  
        yScroll = document.body.scrollHeight;  
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari  
        yScroll = document.body.offsetHeight;  
    }  
    
    var windowHeight;  
    if (self.innerHeight) { // all except Explorer  
        windowHeight = self.innerHeight;  
    } else if (document.documentElement && document.documentElement.clientHeight) {  
    // Explorer 6 Strict Mode  
       windowHeight = document.documentElement.clientHeight;  
    } else if (document.body) { // other Explorers  
       windowHeight = document.body.clientHeight;  
    }  
 
    // for small pages with total height less then height of the viewport  
    if(yScroll < windowHeight){  
        pageHeight = windowHeight;  
    } else {  
        pageHeight = yScroll;  
    }  
      return pageHeight;  
}  
           
function getWidth(){  
 
        var xScroll  
 
        if (window.innerHeight && window.scrollMaxY) {  
        xScroll = document.body.scrollWidth;  
        } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac  
        xScroll = document.body.scrollWidth;  
        } else {  
        xScroll = document.body.offsetWidth;  
        }  
 
        var windowWidth  
        if (self.innerHeight) { // all except Explorer  
        windowWidth = self.innerWidth;  
        } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode  
        windowWidth = document.documentElement.clientWidth;  
        } else if (document.body) { // other Explorers  
        windowWidth = document.body.clientWidth;  
        }  
 
        if(xScroll < windowWidth){  
        pageWidth = windowWidth;  
        } else {  
        pageWidth = xScroll;  
        }  
      return pageWidth;  
} 

 

javascript 各种得到浏览器宽度和高度的函数 

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 +" 像素/英寸"+"
";  
    s += " window的页面可视部分实际高度(ff) "+window.innerHeight+"
";     
    alert (s);  
} 

 

文章来源:http://my.oschina.net/liangrockman/blog/8289   http://my.oschina.net/liangrockman/blog/8291?catalog=45529

TAG: javascript , php学习 , 浏览器尺寸 , 页面可视尺寸

共有0条评论 发表评论>>

点击换一张验证码