原生js--兼容获取窗口滚动条位置和窗口大小的方法
各个浏览器对获取获取窗口滚动条位置和窗口大小没有提供统一的API,以下是对其封装,解决兼容性问题
/**
* 获取浏览器视口的大小(显示文档的部分)
*
*/
function getViewPortSize(){
// 除IE8及更早的版本以外的浏览器
if( window.innerWidth != null ){
return {
w : window.innerWidth,
h : window.innerHeight
}
}
// 标准模式下的IE
if( document.compatMode == "css1Compat" ){
return {
w : document.documentElement.clientWidth,
h : document.documentElement.clientHeight
}
}
// 怪异模式下的浏览器
return {
w : document.body.clientWidth,
h : document.body.clientHeight
}
}
/**
* 获取窗口滚动条的位置
*/
function getScrollOffset(){
// 除IE8及更早版本
if( window.pageXOffset != null ){
return {
x : window.pageXOffset,
y : window.pageYOffset
}
}
// 标准模式下的IE
if( document.compatMode == "css1Compat" ){
return {
x : document.documentElement.scrollLeft,
y : document.documentElement.scrollTop
}
}
// 怪异模式下的浏览器
return {
x : document.body.scrollLeft,
y : document.body.scrollTop
}
}