众所周知,javascript差不多由三部分组成,ECMAscript,BOM,DOM。而BOM代表的是游览器模型,各大游览器兼容是最麻烦的,今天主要是几个游览器对窗口,视口位置、大小的兼容处理。
1、游览器视口距离屏幕的位置(左上角)left及top
ie,chrome : 支持window.screenLeft,window.screenTop --------------ie/55,0( 默认加上上面导航栏的高度) chrome/0,0
firefog,chrome : window.screenX,window.screenY ---------------------------firefog/-8,-8 chrome /0,0
兼容:var left = typeof window.screenLeft === "number" ? window.screenLeft : window.screenX; var top = typeof window.screenTop === "number" ? window.screenTop : window.screenY;
2、window.innerWidth、document.documentElement.clientWidth、document.body.clientWidth
var width,height;
if( window.innerWidth ){ // firefog 和 chrome 本身也支持document.documentElement.clientWidth,直接window属性提高点点点性能
width = window.innerWidth;
height = window.innerHeight;
}else{
if( document.compatMode === "CSS1Compat" ){ //兼容ie6的怪异模式BackCompat
width = document.documentElement.clientWidth;
height = document.documentElement.clientHeight;
}else {
width = document.body.clientWidth;
height = document.body.clientHeight;
}
}
3、
网友评论