一些常用的兼容函数。
获取滚动条的高度:
1 function getScrollTop1() { 2 if ('pageYOffset' in window) { 3 return window.pageYOffset; 4 } else if (document.compatMode === "BackCompat") { 5 return document.body.scrollTop; 6 } else { 7 return document.documentElement.scrollTop; 8 } 9 } 10 11 12 或者: 13 function getScrollTop() { 14 return !('pageYOffset' in window) 15 ? (document.compatMode === "BackCompat") 16 ? document.body.scrollTop 17 : document.documentElement.scrollTop 18 : window.pageYOffset; 19 }
获取CSS样式;
1 function css(o,attr,val){ 2 if(arguments.length==2){ 3 return o.currentStyle ? o.currentStyle[attr] : getComputedStyle(o,false)[attr]; 4 } 5 else 6 { 7 o.style[attr]=val+'px'; 8 } 9 }
面向对象缓冲函数:
1 function move (o,json,fx,fn){ 2 var self=this; 3 o.timer && clearInterval(o.timer); 4 o.timer=setInterval(function(){ 5 var bStop=true; 6 var cur=0; 7 8 for(var attr in json){ 9 cur=attr=='opacity' ? parseInt(parseFloat(self.css(o,attr)).toFixed(2)*100):parseInt(self.css(o,attr)); 10 var speed=(json[attr]-cur)/fx; 11 speed=speed>0?Math.ceil(speed):Math.floor(speed); 12 if(attr=='opacity'){ 13 o.style.filter='alpha(opacity:'+(speed+cur)+')'; 14 o.style.opacity=(speed+cur)/100; 15 } 16 else{o.style[attr]=(cur+speed)+'px'; 17 }; 18 if(cur!=json[attr]){ 19 bStop=false; 20 }; 21 if(bStop){ 22 clearInterval(o.timer); 23 (typeof fn=='function')&&fn(); 24 } 25 } 26 },30) 27 };
后来发现上面的缓冲函数的最后一个参数有问题,本意应该是缓冲之后执行的函数,但是放在for循环里的话,每次循环都会被调用,所以应该改成下面的函数:
1 function move(o,json,fx,fn){ 2 o.timer&&clearInterval(o.timer); 3 o.timer=setInterval(function(){ 4 var bStop=true; 5 var cur=o; 6 7 for(var attr in json){ 8 cur=attr=="opacity"?(parseFloat(css(o,attr)).toFixed(2)*100):parseInt(css(o,attr)); 9 var speed=(json[attr]-cur)/fx; 10 speed=speed>0?Math.ceil(speed):Math.floor(speed); 11 if(attr=="opacity") 12 { o.style.filter='alpha(opacity:'+(speed+cur)+')'; 13 o.style.opacity=(speed+cur)/100; 14 } 15 else{ 16 o.style[attr]=(cur+speed)+"px"; 17 } 18 19 } 20 21 if(cur!=json[attr]) 22 {bStop=false;} 23 if(bStop) 24 {clearInterval(o.timer); 25 (typeof fn=="function")&&fn(); 26 27 } 28 29 30 },30) 31 32 33 34 35 }
1 function move(o,json,fx,fn){ 2 o.timer&&clearTimeout(o.timer); 3 for(var attr in json){ 4 var style=o.currentStyle ? o.currentStyle[attr]:getComputedStyle(o,false)[attr]; 5 var cur=attr=="opacity"? parseInt(parseFloat(style).toFixed(2)*100):parseInt(style); 6 var speed=(json[attr]-cur)/fx; 7 speed=speed>0?Math.ceil(speed):Math.floor(speed); 8 if(attr=='opacity'){ 9 o.style.filter='alpha(opacity:'+(speed+cur)+')'; 10 o.style.opacity=(speed+cur)/100; 11 } 12 else{o.style[attr]=(cur+speed)+'px'; 13 }; 14 } 15 if(speed){o.timer=setTimeout(function(){move(o,json,fx,fn)},10)} 16 else{(typeof fn=="function")&&fn()} 17 18 }