运动函数的封装

Posted 2022-12-05 zoutuan

 

 1 var timer = null;//定时器
 2 function startMove(obj, objArr, callback) 
 3     clearInterval(obj.timer);//清除上一次的定时器
 4     var onOff = false;//定义开关，初始值为false
 5     obj.timer = setInterval(function () 
 6         // console.log(attr);//属性
 7         // console.log(objArr[attr]);//属性值
 8         //遍历对象
 9         for (var attr in objArr) 
10             //获取实时位置
11             var tmpPos = parseInt(getPos(obj, attr));
12             //定义步长值
13             var speed = (objArr[attr] - tmpPos) / 10;
14             //判断步长值
15             speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
16            
17             //赋值给对象
18             obj.style[attr] = tmpPos + speed + ‘px‘;
19 
20         
21          //判断元素运动的临界值
22          if((tmpPos + speed)==objArr[attr]) onOff = true;
23         if(onOff)
24             clearInterval(obj.timer);
25             if(callback)
26                 callback();
27             
28         
29     , 30)
30 
31 
32 //封装函数获取实时位置
33 function getPos(obj, attr) 
34     if (obj.currentStyle) 
35         return currentStyle[attr];//IE
36      else 
37         return getComputedStyle(obj)[attr];//非IE
38     
39