請問這段代碼哪里錯了?
原本的透明度為30的黃色方塊,
要的效果是 用JS使鼠標移入透明度到100,
????????????????????????????鼠標移出透明度恢復到30,
可是我的效果是反的,移入30移出100,IE和chrome都是這樣,這是哪里錯了?
PS:我把box.onmouseover里的100和box.onmouseout里的30對調(diào)時是對的,不知道為什么
<!doctype?html> <html?lang="en"> <head> ????<meta?charset="UTF-8"> ????<title>透明度動畫</title> ????<style?type="text/css"> ????????body,div{ ????????padding:0; ????????margin:0; ????????font:normal?12px?"微軟雅黑" ????????} ????????#box{ ????????????width:200px; ????????????height:150px; ????????????background-color:?gold; ????????????top:0; ????????????left:20px; ????????????filter:?alpha(opacity:30); ????????????opacity:?0.3; ????????} ????</style> ????<script?type="text/javascript"> ????????window.onload=function()?{ ????????????var?box?=?document.getElementById("box"); ????????????box.onmouseover?=?function(){startMove(100)}; ????????????box.onmouseout?=function(){startMove(30)}; ????????}; ????????var?alpha=30, ?????????????timer=null; ????????????function?startMove(target){ ????????????????clearInterval(timer); ????????????var?speed=?0; ????????????if(alpha>target){ ????????????????speed=-10; ????????????}else{ ????????????????speed=10; ????????????} ????????????timer=setInterval(function(){ ????????????????if(alpha==target){ ????????????????????clearInterval(timer); ????????????????}else{ ????????????????????alpha+=speed; ????????????????} ????????????},30); ????????????var?box?=?document.getElementById("box"); ????????????box.style.filter="alpha(opacity:"+alpha+");"; ????????????box.style.opacity=alpha/100; ????????} ????</script> </head> <body> <div?id="box"></div> </body> </html>
2016-05-06
?var?box?=?document.getElementById("box");
????????????box.style.filter="alpha(opacity:"+alpha+");";
????????????box.style.opacity=alpha/100;
這最后三行代碼要放在計時器setInterval的函數(shù)內(nèi)啊