<!DOCTYPE html><html lang=""> <head> <meta charset="utf-8"> <style type="text/css"> div{ width: 200px; height: 200px; background: red; margin: 20px; float: left; opacity: 0.3; } </style> <script type="text/javascript"> window.onload=function(){ var aDiv=document.getElementsByTagName('div'); for (var i = 0; i < aDiv.length; i++) { aDiv[i].timer=null; aDiv[i].onmouseover=move(this,100); }; for (var i = 0; i < aDiv.length; i++) { aDiv[i].onmouseout=move(this,30); }; }; function move(obj,tar){ clearInterval(obj.timer); obj.timer=setInterval(function(){ var alpha=30; if(alpha==tar){ clearInterval(obj.timer); }else{ var speed=(tar-alpha); speed=speed>0?Math.ceil(speed):Math.floor(speed); alpha+=speed; }; obj.style.opacity=alpha/100; } , 30); }; </script> </head> <body> <div></div> <div></div> <div></div> <div></div> </body></html>
添加回答
举报
0/150
提交
取消