一、整合:
<script>
function getCss(obj,val){//封装兼容性获取CSS样式属性,obj为获取的对象,val为要获取的样式名
if(getComputedStyle(obj,true)[val]){
return getComputedStyle(obj,true)[val];
}else{
return obj.currentStyle[val];
}
}//解决用offsetxx来设置变化的bug 要注意函数返回的是字符串类型,若要使用返回值要转换回number类型
window.οnlοad=function(){//页面载入时调用以下js代码
var divs=document.getElementsByTagName('div');//获取页面中的div
var timer=null;
function move(obj,name,target){//对对象的css样式逐渐改变的函数整合
clearInterval(obj.timer);//使用定时器前先清掉定时器,防止出现bug
obj.timer=setInterval(function(){//timer定时器每隔30毫秒来调用此方法
if(name=='opacity'){//如果想要改变的样式是透明度
var op = parseFloat(getCss(obj,name))*100;
//用getCss方法获取对象原本的name样式,这里是opacity
var speed=(target-op)/10;
//用speed变量来控制透明度改变的速度,目标值减对象的透明值
speed=speed>0?Math.ceil(speed):Math.floor(speed);
//对speed取整,若speed值大于0,让speed向上取整,否则向下取整
//关于取整 例23.3 math.ceil(23.3)=24,math.floor(23.3)=23,math.round是四舍五入
op += speed;//op为每次设置的透明度值
obj.style.filter='alpha(opacity='+op+')';//兼容IE
obj.style.opacity=op/100;
//兼容非ie
}else{//如果设置的不是透明度,是关于像素数值改变的(如width,height,borderwidth等),则调用下面的方法
var speed=(target-parseInt(getCss(obj,name)))/10;
speed=speed>0?Math.ceil(speed):Math.floor(speed);//同上
obj.style[name]=parseInt(getCss(obj,name))+speed+'px';
}
},30);
}
}
</script>