(不是问题)这是老师的运动框架源码:

来源:-

慕媛

2015-06-24 17:43

//完美的运动框架:

function startMove(obj,json,fn)

{

var flag = true;

clearInterval(obj.timer);

obj.timer=setInterval(function(){

for(var attr in json){

//1.取当前值

var iCur = 0;

if(attr=='opacity')

{

iCur = Math.round(parseFloat(getStyle(obj,attr))*100);

}

else

{

iCur = parseInt(getStyle(obj,attr));

}

//2.算速度

var iSpeed=(json[attr]-iCur)/8;

iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);

//3.检测停止

if(iCur!=json[attr])

{

flag = false;

}

if(attr=='opacity')

{

obj.style.filter='alpha(opacity:'+(iCur+iSpeed)+')';

obj.style.opacity=(iCur+iSpeed)/100;

}

else

{

obj.style[attr]=iCur+iSpeed+'px';

}

} <!--遍历json结束-->

if(flag){//所有条件都达到了

clearInterval(obj.timer);

if(fn){

fn();

}

}

},30);

}


//好神奇的方法:

function getStyle(obj,attr){

     if(obj.currentStyle){

     return obj.currentStyle[attr];

     }else{

     return getComputedStyle(obj,false)[attr];

     }

}


写回答 关注

1回答

  • 慕媛
    2015-06-24 17:44:53

    自己整理的核心源码。。。

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113920 学习 · 1450 问题

查看课程

相似问题