JS之链式运动，及任意值运动框架，包括透明度的改变

Posted 2020-07-27 RitaLee

　　链式运动，顾名思义，一环扣一环，即执行完一个事件后，再接着执行下一个事件，在参数上面动手脚，将下一个要执行的函数名作为一个参数，即利用到回掉函数，下面代码中出现的fn，即回掉函数，

 1 function move(obj,attr,target,fn){
 2     clearInterval(obj.timer);
 3     obj.timer = setInterval(function(){
 4     var iCur=0;
 5     if (attr == ‘opacity‘) {
 6         iCur=parseInt(parseFloat(getStyle(obj,attr))*100);
 7     }else{
 8         iCur = parseInt(getStyle(obj,attr));
 9     }
10     var speed = (target-iCur)/8
11     speed = speed>0?Math.ceil(speed):Math.floor(speed);
12         if (iCur == target) {
13             clearInterval(obj.timer);
14             fn&&fn();//注意位置，要放在这里
15         }
16        else {
17             if (attr ==‘opacity‘) {
18                 obj.style.opacity=(iCur+speed)/100;
19             }else{
20                 obj.style[attr]=iCur+speed+‘px‘;
21                }
22     }
23 
24     },30);
25 }