<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>透明度</title> <style type="text/css"> *{margin: 0;padding: 0;} #box1{width: 200px;height: 200px;background: red;filter: alpha(opacity:30);opacity: 0.3;} </style> <script type="text/javascript"> window.onload=function(){ var v=document.getElementById('div1'); v.onmouseover=function(){ star(100); } v.onmouseout=function(){ star(30); } } var timer=null; var alpha=30; function star(iTarget){ var v=document.getElementById('div1'); clearInterval(timer); timer=setInterval(function(){ var speed=0; if(alpha>iTarget){ speed=-10; }else{ speed=10; } if(alpha==iTarget){ clearInterval(timer); }else{ alpha=alpha+speed; v.style.filter='alpha(opacity:'+alpha+')' v.style.opacity=alpha/100; } },30) } </script> </head> <body> <div id="box1"></div> </body> </html>
你的id定义为box1,但是你上面在getElementById('div1')的时候都写成了div1