JavaScript 代码
- // JavaScript Document
- function getStyle(obj,attr)
- {
- if(obj.currentStyle)
- {return obj.currentStyle[attr];}
- else
- {return getComputedStyle(obj,false)[attr];}
- }
- function move(obj,JSON,fn)
- {
- var oL=0;// 当前状态
- var attr=0;
- var iTarget=0;
- var iSpeed=0;
- clearInterval(obj.timer);
- obj.timer=setInterval(function(){
- obj.onoff=true;
- for(attr in JSON)
- {
- iTarget=JSON[attr];//JSON 里面的目标点
- iTarget=parseInt(iTarget);
- // 获取初始值开始
- if(attr=="opacity")
- {
- oL=parseInt(getStyle(obj,attr)*100);
- if(isNaN(oL)){oL=100;}// 初始值为 1,IE 没写 opacity
- }
- else
- {oL=parseInt(getStyle(obj,attr));}
- // 计算速度开始
- if(iTarget>oL)
- { iSpeed=Math.ceil((iTarget-oL)/7)} <!--7 为需要用的时间, iSpeed 为缓冲速度 -->
- else
- {iSpeed=Math.floor((iTarget-oL)/7)}
- if(oL!=iTarget)// 多属性运动时 如果一个属性值未到达目标点 则把 obj.onoff 赋值为 false
- {
- obj.onoff=false;
- }
- if(attr=="opacity")
- {
- obj.style.opacity=(oL+iSpeed)/100;
- obj.style.filter="alpha('opacity"+(oL+iSpeed)+"')";
- }
- else
- {
- obj.style[attr]=oL+iSpeed+"px";
- }
- }
- // 停止条件 属性值都到达 obj.onoff 赋值为 true 停止
- if(obj.onoff)
- {
- clearInterval(obj.timer);
- if(fn)
- {fn()}
- }
- },30);
- }
来源: http://www.qdfuns.com/article/18184/65a88c670199e39b3a1ad34ebf727de5.html