<!doctype html><html><head><meta charset="UTF-8"><title>Document</title><style>*{ margin: 0; padding:0;}div{ margin: 10px; float: left; width: 200px; height: 200px; background-color: red; filter: alpha(opacity:30); opacity: 0.3;}</style><script>window.onload=function() {? ? var oDiv=document.getElementsByTagName("div");? ? for(var i=0;i<oDiv.legth;i++){? ? ? ? oDiv[i].alpha=30; ? ?//多物體運動時,清除定時器(每一個都定義就不會爭)? ? ? ? oDiv[i].onmouseover=function(){? ? ? ? ? ? startMove(this,100);? ? ? ? }? ? ? ? oDiv[i].onmouseout=function(){? ? ? ? ? ? startMove(this,30);? ? ? ? }? ? }}//var timer=null;//var alpha=30; ? ? //定義一個變量function startMove(obj,iTarget){? ? clearInterval(obj.timer);? ? obj.timer=setInterval(function(){? ? ? ? var speed=0;? ? ? ? if(obj.alpha>iTarget){? ? ? ? ? ? speed=-10;? ? ? ? }else{? ? ? ? ? ? speed=10;? ? ? ? }? ? ? ? if(obj.alpha==iTarget){? ? ? ? ? ? clearInterval(obj.timer);? ? ? ? }else{? ? ? ? ? ? obj.alpha+=speed;? ? ? ? ? ? obj.style.filter='alpha(opacity:'+obj.alpha+')';? ? ? ? ? ? obj.style.opacity=obj.alpha/100;? ? ? ? }? ? },30)? ?}</script></head><body>? ? <div id="div1"></div> ??? ? <div id="div2"></div>? ? <div id="div3"></div>? ? <div id="div4"></div></body></html>
多物體透明度問題,(怎么沒反應(yīng))?
小蘋果615
2016-03-29 14:58:43