JS任意元素的任意值运动

函数原型startMove(obj,name,iTag);

例如:

startMove(obj,’width’,400);//width运动到width:400px

startMove(obj,’height’,400);//height运动到height:400px

startMove(obj,’opacity’,100);//透明度变到100(不透明)

startMove(obj,’fontSize’,56);//字体大小变到56px

startMove(obj,’BorderWidth’,100);//边框大小变到100px

这些都是缓冲运动,具有渐变的效果

startMove函数实现如下:

//name是元素的属性名function startMove(obj,name,iTag){clearInterval(obj.timerId);obj.timerId = setInterval(function () {var styleValue = 0;if(name == 'opacity') //透明度要乘以100styleValue = Math.round(parseFloat(getStyle(obj,name))*100);//四舍五入，防止出现.000000001和.999999的情况elsestyleValue = parseFloat(getStyle(obj,name));var speed = (iTag - styleValue)/6;speed = speed>0?Math.ceil(speed):Math.floor(speed);if(iTag == styleValue)clearInterval(obj.timerId);else{if(name == 'opacity') //透明度另外处理{obj.style[name] = (styleValue+speed)/100;obj.style.filter = 'alpha(opacity:'+(styleValue+speed)+')';}elseobj.style[name] = styleValue + speed + 'px';}},30);}//获取任意位置的样式function getStyle(obj,name){if(obj.currentStyle)//兼容IEreturn obj.currentStyle[name];elsereturn getComputedStyle(obj,false)[name];}