為什么會出現(xiàn)這樣的問題?
<!DOCTYPE?html> <html> <head> <meta?charset="UTF-8"> <title></title> <style?type="text/css"> body{margin:?0;padding:?0;} #div1{width:560px;height:660px;background-color:#0C4E7C;position:fixed;left:-560px;} span{width:20px;height:50px;background-color:#FFA500;position:absolute;left:560px;border:?5px?dotted?#8B0000;} #div2{width:?200px;height:?200px;background-color:?#8B0000;opacity:0.3;margin-left:30px;} </style> <script?type="text/javascript"> window.onload=function(){ var?div=document.getElementById("div1"); //var?stl=window.getComputedStyle(div,null); var?div1=document.getElementById("div2"); //div.style.top=(document.documentElement.clientHeight/2)-parseInt(stl.height)/2+"px"; //透明變化 div1.onmouseover=function(){ stars(100); } div1.onmouseout=function(){ stars(30); } //伸縮運(yùn)動 div.onmouseover=function(){ starMove(0); } div.onmouseout=function(){ starMove(-560); } } //2-1&3-1 var?timer=null; function?starMove(sp){ clearInterval(timer); var?div=document.getElementById("div1"); timer=setInterval(function(){ var?speed=0; if(div.offsetLeft<sp){speed=6;} else{speed=-6;} if(div.offsetLeft==sp){ clearInterval(timer); } else{ if(div.offsetLeft>-560/2){speed=speed*3;}else{speed=speed;} div.style.left=div.offsetLeft+speed+"px"; //解決抖動 if(div.offsetLeft>0){clearInterval(timer);div.style.left="0px";} if(div.offsetLeft<-560){clearInterval(timer);div.style.left="-560px";} } },26) } //2-2 var?tiimer=null; var?aph=30; function?stars(isp){ var?div1=document.getElementById("div2"); clearInterval(tiimer); tiimer=setInterval(function(){ var?speed=0; if(aph>isp){speed=-10;}else{speed=10;} if(aph==isp){clearInterval(tiimer);} else{ aph+=speed; div1.style.opacity=aph/100;} },30) } </script> </head> <body> <div?id="div1"> <span>分享</span> </div> <div?id="div2"> </div> </body> </html>
為什么這個藍(lán)色的DIV會被透明化?我沒給他設(shè)置透明啊。
http://idcbgp.cn/video/2880
2016-05-30
在div1的css里面設(shè)置z-index的值,大于0就能覆蓋,等于0就是你現(xiàn)在的情況。