function animate(args){ //保存运动对象 this.animateTarget=args.obj; //保存运动的属性 this.animateProperty=args.property; //保存速度 this.animaterSpeed=args.speed||6; //保存回调函数 this.callBack=args.callBack||false; //初始化动画 this.initAnimate(); }; animate.prototype={ initAnimate:function(){ var _this=this,speed; window.clearInterval(this.animateTarget.timer); this.animateTarget.timer=window.setInterval(function(){ var isClear=true; for(var prop in _this.animateProperty){ speed=(_this.animateProperty[prop]-_this.getCurrentStyleValue(prop))/(10-_this.animaterSpeed); speed=speed>0?Math.ceil(speed):Math.floor(speed); if(_this.getCurrentStyleValue(prop)!=_this.animateProperty[prop]){ isClear=false; }; if(Math.abs(_this.getCurrentStyleValue(prop)-_this.animateProperty[prop])<=_this.animaterSpeed){ _this.animateTarget.style[prop]=_this.animateProperty[prop]+"px"; }else{ _this.animateTarget.style[prop]=_this.getCurrentStyleValue(prop)+speed+"px"; }; }; if(isClear){ window.clearInterval(_this.animateTarget.timer); if(_this.callBack){_this.callBack.call(_this.animateTarget)}; }; },13); }, //获取当前属性的属性值 getCurrentStyleValue:function(property){ var result; if(window.getComputedStyle){ result=window.getComputedStyle(this.animateTarget,null)[property]; }else{ result=this.animateTarget.currentStyle[property]; }; return parseInt(result); } };
boxs[i].onclick=function(){ new animate({ obj:this, property:{ marginLeft:400, height:100 }, speed:3, callBack:function(){ //alert(this); } }); }