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

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

 1 function move(obj,attr,target,fn){
 2     clearInterval(obj.timer);
 3     obj.timer = setInterval(function(){
     //1,取当前值
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 }
     //2,算速度
10 var speed = (target-iCur)/8 11 speed = speed>0?Math.ceil(speed):Math.floor(speed);
     //3,计时停止
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 }

  对于以上框架,还有可以利用json对其进行优化,以上框架是每次改变一个属性,利用json则可以同时改变多个属性,详情见  下篇博文,JS之完美框架

posted @ 2016-06-20 19:41  RitaLee  阅读(248)  评论(0编辑  收藏  举报