(function(a)
{
var json={};
//测试函数
function test() {alert("test")}
//toMove
function toMove(obj,json,endFn)
{
clearInterval(obj.timmer);
obj.timmer = setInterval(function()
{
var bStop = true;
for(attr in json)
{
curr = attr=="opacity"?parseInt(getStyle(obj,attr)*100):parseInt(getStyle(obj,attr));
if(json[attr] != curr)bStop=false;
speed =(json[attr]-curr)/6;
speed = speed>0?Math.ceil(speed):Math.floor(speed);
curr += speed;
obj.style[attr] = attr=="opacity"?curr/100:curr +'px';
}
if(bStop == true)
{
clearInterval(obj.timmer);
if(endFn)endFn();
}
},30)
}
//getStyle
function getStyle(obj,attr)
{
if(obj.currentStyle)
{
return obj.currentStyle;
}else{
return getComputedStyle(obj,null)[attr];
}
}
//将方法插入json，并将json赋值给传入的变量；
json.test = test;
json.getStyle = getStyle;
json.toMove = toMove;
window[a] = json;
})('jacklin')
这个运动框架有以下几个知识点：
1、offsetWidth 有局限性，当加了边框之后，offser... 取得的值不准确，所以要用 ie的currentStyle 和 其他浏览器的 getComputedStyle 来封装一个取得当前所需要的属性值的工具。
2、缓冲运动速度计算时候回遇到一个问题，当速度很小小于1的时候，浏览器不接受，比如1.99999px，浏览器会认为是1px,所以会在目标之前卡住，解决方法是有向上取整和向下取整的方法，将速度变为正1或-1,把最后的距离走完。
3、定时器和所有值都不能共有，因为当多物体运动的时候，要区分每个定时器和属性，不然会产生混乱。方法是给属性和定时器加上obj. 将他们定义为这个对象的属性。
4、单个物体不断触发运动事件会造成同时开启多个定时器，所以，运动开始之前要先清除之前的定时器。
5、当多属性值同时运动的时候，有可能一个属性值先到达了终点，但是假如这个时候清除定时器，就会卡主，所以到要等其他的属性值都到达了才能清除定时器，做法是，定时器刚进来的时候，就定义bStop = true,假设每个值都到了，在json遍历进来的时候定义，假如存在curr != json[attr] 那么bStop = false ；这个时候，假如第一个值已经到了，定时器不会停止，而已经到了的值，由于curr = json[attr] 速度值一直为0，所以就等着其他的都到了之后，在json遍历的外部定义，假如bStop = true，就停止定时器，并出发定义的链式函数。
6、链式运动其实就是加上一个函数作为参数，在运动结束的时候判断，假如设定了这个函数，就运行它，if(endFn)endFn();
7、最后，类似于库的封装的思路，()() 第一个括号里面写函数，就相当于定义并且执行这个函数，在第二个括号里面传入参数，在第一个括号里面的函数里写入形参。函数里面就把函数中所有的方法，加入到一个json里面，最后，将传进来的参数作为去全局变量.window[jacklin] = json,这样，以后再调用这个库所有的方法的时候，只需要用到jacklin这一个参数，不污染其他的变量。
