<!DOCTYPE html><html><head><meta charset="UTF-8"><title>透明度動(dòng)畫</title><style type="text/css">? ? ?body,div{? ? ? margin: 0;? ? ? padding: 0;? ? ?}? ? ? #div1{? ? ? ?width: 200px;? ? ? ?height: 200px;? ? ? ?background-color: red;? ? ? ?filter:alpha(opacity:30);/*透明度是30*/? ? ? ?opacity: 0.3;? ? ? }</style><script type="text/javascript">? ? ? ? ?//任務(wù):當(dāng)鼠標(biāo)移到時(shí):透明度為100;當(dāng)鼠標(biāo)退出時(shí),透明度還原。? ? ? ?window.onload=function(){? ? ? ? ??var ? oDiv=document.getElementById("div1")? ? ? ? ??//當(dāng)鼠標(biāo)移入時(shí)執(zhí)行startMOve函數(shù)? ? ? ? ??oDiv.onmouseover=function(){? ? ? ? ?? startMOve(100);? ? ? ? ??}? ? ? ? ??//當(dāng)鼠標(biāo)移出時(shí)也執(zhí)行startMOve函數(shù)? ? ? ? ??oDiv.onmouseout=function(){? ? ? ? ?? startMOve(30);? ? ? ? ??}? ? ? ?}? ? ? ? ? ? var ?timer=null;? ? ? ? ? ? var ? alpha=30;? ? ? ? ? ?function startMove(iTarget){? ? ? ? ? ? ? ? var ?oDiv=getElementById("div1");? ? ? ? ? ? ? ? clearInterval();//關(guān)閉定時(shí)器,防止疊加? ? ? ? ? ? ? ? //再開一個(gè)定時(shí)器? ? ? ? ? ? ? ?timer= ? setInterval(function(){? ? ? ? ? ? ? ? ? ? ? ?//判斷速度? ? ? ? ? ? ? ? ? ? ? ?var ?speed=0;? ? ? ? ? ? ? ? ? ? ? ?if (alpha>iTarget) {? ? ? ? ? ? ? ? ? ? ? ? speed=-10;? ? ? ? ? ? ? ? ? ? ? ?}else{? ? ? ? ? ? ? ? ? ? ? ? speed=10;? ? ? ? ? ? ? ? ? ? ? ?}? ? ? ? ? ? ? ? ? ? ? ? if (alpha==iTarget) {? ? ? ? ? ? ? ? ? ? ? ? ?clearInterval(timer);? ? ? ? ? ? ? ? ? ? ? ? }else{? ? ? ? ? ? ? ? ? ? ? ? ?alpha+=speed;? ? ? ? ? ? ? ? ? ? ? ? oDiv>style.filter='alpha(opacity:'+alpha+')';? ? ? ? ? ? ? ? ? ? ? ? oDiv.style.opacity=alpha/100;? ? ? ? ? ? ? ? ? ? ? ? }? ? ? ? ? ? ? ?} ,30 )//每隔30毫秒去執(zhí)行? ? ? ? ? ?}</script></head><body><div id="div1"></div></body></html>搜狗瀏覽器,為什么透明度動(dòng)畫無法改變???求教
搜狗瀏覽器,為什么透明度動(dòng)畫無法改變???
xue111
2015-12-29 12:56:15