前段时间看了视频学了用JS写运动框架,不敢私藏,于是分享出来。。也在此做个笔记,以便以后查看。
//JS运动框架
function startMove ( obj,json,callback)
{
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var isStop = 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 = (json[attr]-cur)/6;
speed = speed>0?Math.ceil(speed):Math.floor(speed);
if(cur!=json[attr])
{
isStop = false;
}
if(attr == 'opacity')
{
obj.style.opacity=(cur+speed)/100;
// obj.style.filter='alpha(opacity:'+(cur+speed)+')'
}
else
{
obj.style[attr]=cur+speed+'px';
}
}
if(isStop==true)
{
clearInterval(obj.timer);
if(callback)
{
callback();
}
}
},30);
}
//获取样式表属性
function getStyle(obj , name)
{
if(obj.currentStyle){
return obj.currentStyle[name];
}
else
{
return this.getComputedStyle(obj,false)[name];
}
}
代码可以直接运行,大家可以试试看。。。。