大家好 我是过往云烟  这几天写了一个 JS运动框架,基本上和JQ封装好的动画方法类似  可以改变透明度  高度宽度  字体大小 等等 很多值,原生态JS写的  而且还支持回调函数,可谓是功能应有尽有啊
下面是框架的源码


function getStyle(obj, attr)
{
if(obj.currentStyle)
{
return obj.currentStyle[attr];
}
else
{
return getComputedStyle(obj, false)[attr];
}
}

function startMove(obj, json, fn)
{
clearInterval(obj.timer);
obj.timer=setInterval(function (){
var bStop=true; //这一次运动就结束了——所有的值都到达了
for(var attr in json)
{
//1.取当前的值
var iCur=0;

if(attr=='opacity')
{
iCur=parseInt(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])
{
bStop=false;
}

if(attr=='opacity')
{
obj.style.filter='alpha(opacity:'+(iCur+iSpeed)+')';
obj.style.opacity=(iCur+iSpeed)/100;
}
else
{

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

if(bStop)
{
clearInterval(obj.timer);

if(fn)
{
fn();
}
}
}, 30)
}






调用的话   就直接把这2个函数放到一个JS文件里面   第一个函数是获取样式的 第二个函数是运动框架本身    获取样式 是JSON格式  比如要改变一个DIV的宽度  可以这样写
startMove('div',{width:100});
如果改变多个值可以这样
startMove('div',{width:100,height:200});
同时还支持链式运动 
startMove(div,{width:100,height:100},function(){
  startMove(div,{opacity:20});
});
这样就可以 先改变高度宽度 然后在改变透明度