//匀速运动框架 (对象,{ 属性:值 },速度,回调函数)
function startMove(obj,json,num,fnEnd){
clearInterval(obj.timer);
obj.timer = setInterval(function(){
var onoff = true;
for(var attr in json){
var cur = 0;
//兼容透明
if(attr == 'opacity'){
cur = Math.round(parseFloat(getStyle(obj,attr)) * 100);
}else{
cur = parseInt(getStyle(obj,attr));
}
var speed = 0;
var target = json[attr];
cur < target ? speed = num : speed = -num;
if(cur != target) onoff = false;
if(attr == 'opacity'){
obj.style.filter = 'alpha(opacity:' + (cur + speed) + ')';
obj.style.opacity = (cur + speed) / 100;
}else{
obj.style[attr] = cur + speed + 'px';
}
if(Math.abs(cur - target) < num){
obj.style[attr] = target + 'px';
}
}
if(onoff){
clearInterval(obj.timer);
if(fnEnd) fnEnd();
}
console.log(speed,cur);
},30);
}
//获取css样式
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj, false)[attr];
}
}
JS - 匀速运动框架
最新推荐文章于 2019-05-26 17:28:34 发布