                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /JavaScript
                        
                        /JS動(dòng)畫(huà)效果

為什么這里設(shè)置透明度時(shí)用opacity,50而不是用opacity,0.5,在程序第四十步cur=Math.round(parseFloat(getStyle(obj,attr))*100);里不是已經(jīng)乘了100了嗎？

<!DOCTYPE??HTML>
<html?>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>
<title>鏈?zhǔn)竭\(yùn)動(dòng)</title>
<style>
div{width:200px;height:200px;background-color:yellow;margin:10px;float:left;}
</style>
<script?type="text/javascript">
???window.onload=function()
????{
?????var?oDiv1=document.getElementById('div1');
	?
	???oDiv1.onmouseover=function()
	???{
	?????startMove(this,'height',400,function()
		?{
		??startMove(oDiv1,'opacity',50);
		?});
	???};
	???oDiv1.onmouseout=function()
	???{
	?????startMove(this,'height',200);
	???};
	??
????}
??function?getStyle(obj,attr){
?????if(obj.currentStyle){
	???return?obj.currentStyle[attr];}
	?else{
	???return?getComputedStyle(obj,false)[attr];}
??}
??function?startMove(obj,attr,iTarget,fn)
??{
	?clearInterval(obj.timer);
	?obj.timer=setInterval(function(){
	?var?cur=0;
	?if(attr=='opacity')
	?{
	????cur=Math.round(parseFloat(getStyle(obj,attr))*100);
	?}
	?else?{?cur=parseInt(getStyle(obj,attr))};?
	?var?speed=(iTarget-cur)/6;
	?speed=speed>0?Math.ceil(speed):Math.floor(speed);
	????if?(cur==iTarget)
		{
		???clearInterval(obj.timer);
		???if(fn){
		???fn();
		???}
		}
	????else
		{
		???if(attr=='opacity')
		???{
		?????obj.style.filter='alpha(opacity:'+(cur+speed)+')';
			?obj.style.opacity=(cur+speed)/100;
		???}
		???else{obj.style[attr]=cur+speed+'px';}
????????}
	?},30);
??}
</script>
</head>
<body>
<div?id=div1></div>
</body>
</html>