完美运动框架 json,js

 

function getStyle(obj,name){

if(obj.currentStyle){

return obj.currentStyle[name];

}else{

return getComputedStyle(obj,null)[name];

}

}

 

//startMove(oDiv,{width:300,height:400})

function startMove(obj,json,fn){

clearInterval(obj.timer);

var curr=0;

var speed=0;

obj.timer=setInterval(function(){

var bStop=true;

for(var name in json){//遍列json多个属性（name）和属性值

if(name=='opacity'){

curr=Math.round(parseFloat(getStyle(obj,name))*100);

// console.log("opacitycurr="+curr);

}else{

curr=parseInt(getStyle(obj,name));

}

speed=(json[name]-curr)/6;

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

// if(json[name]==curr){//判断当前属性的值

// clearInterval(obj.timer);

// if(fn){

// fn();//顺序执行链式函数

// }

// }

//等所有的值都到达目标点再暂停（有一个没到都不能停），不然有一个先到达，而其他还没到达的属性值就被清除

//如果有一个没到都不能挺

if(curr!=json[name]){

bStop=false;

}

if(name=='opacity'){

curr=curr+speed;

obj.style.filter='alpha(opacity'+curr+')';

obj.style.opacity=curr/100;

}else{

curr=curr+speed;

obj.style[name]=curr+'px';

}

console.log(name+"="+curr);

 

}

//for循环外面判断是否所有属性值都到达目标点

//都到达再清除

if(bStop){

clearInterval(obj.timer);

if(fn){

fn();//顺序执行链式函数

}

}

},300);

}