您的位置:首页 > Web前端 > JavaScript

完美运动框架【js】

2016-08-20 14:55 288 查看
可实现多物体同时运动,链式运动,同一物体同时两种运动

function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}else {
return getComputedStyle(obj,false)[attr];
}
}
//startMove(obj,{attr1:iTarget1, attr2:iTarget2},fn)
function startMove(obj,json,fn){
clearInterval(obj.timer);
var flag = true;
obj.timer=setInterval(function(){
flag = true;
for(var attr in json){
//取当前值
var icur = 0;
if(attr == "opacity"){
icur = Math.round(parseFloat(getStyle(obj,attr))*100);
} else {
icur=parseInt(getStyle(obj,attr));
}

//算速度
var speed=(json[attr]-icur)/8;
speed=speed>0?Math.ceil(speed):Math.floor(speed);

//检测停止
if(icur!=json[attr]){
flag = false;
}
if(attr == "opacity"){
obj.style.filter="alpha(opcity:"+icur+speed+")";
obj.style.opacity=(icur+speed)/100;
} else {
obj.style[attr]=icur+speed+"px";
}
}
if(flag){
clearInterval(obj.timer);
if(fn){
fn();
}
}
},5);
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: