没有透明度改变的效果,求大神答疑解惑,万分感谢
<!DOCTYPE html>
<html>
<head>
<title>opacity</title>
<style type="text/css">
#div1{
height: 200px;
width: 200px;
background-color:red;
filter:alpha(opacity:20);
opacity: 0.2;
}
</style>
</head>
<body>
<div id="div1"></div>
<script>
window.onload=function() {
var oDIV=document.getElementById("div1");
oDIV.onmouseover=onMove(100);
oDIV.onmouseout=onMove(20);
}
var oDIV=document.getElementById("div1");
var timer=null;
var alpha=20;
var speed=0;
function onMove(iTarget){
clearInterval(timer);
timer=setInterval(function(){
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)
}
</script>
</body>
</html>