一些常用的兼容函数。

获取滚动条的高度:

 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 }

 

posted @ 2013-09-04 15:58  鲤鱼在睡觉  阅读(269)  评论(0编辑  收藏  举报