前端开发跨浏览器计算页面大小、滚动高度

来源：互联网发布：会计电算化软件下载编辑：程序博客网时间：2024/05/01 13:51

前端开发中跨平台，跨USER-AGENT的适配非常繁琐

想要得到浏览器px大小很烦，因此下面2个函数非常有用

这两个javascript函数非常实用，用来计算浏览器页面大小，窗口大小，以及滚动高度，源代码如下：

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

参考 http://my.oschina.net/jockchou/blog/465220

0 0