<!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>
為什么沒淡入淡出?
hhhzihao2
2016-04-02 18:19:47
