jscrip 透明度运动
/*我把老师的代码复制了下来，删除了不要ie下的透明度alpha值，虽然实现了这个功能，但是透明度在onmouseover时会在1.1和1.0不停的跳动，在onmouseout时透明度会在0.2和0.3之间跳动，求解这是为啥*/
<!DOCTYPE html>
<html>
<head>
<title>透明度运动</title>
<meta charset="utf-8"/>
<style type="text/css">
*{margin:0; padding:0;}
#div1{width:500px; height:500px; background: #F00; opacity:0.3;}
</style>
<script type="text/javascript">
window.onload = function(){
var div1 = document.getElementById('div1');
div1.onmouseover = function(){
startMove(1);
}
div1.onmouseout = function(){
startMove(0.3);
}
}
var timer = null;
var alpha = 0.3;
function startMove(iTarget){
var div1 = document.getElementById('div1');
clearInterval(timer);
timer = setInterval(function(){
var speed = 0;
if(alpha < iTarget){
speed = 0.1;
} else {
speed = -0.1;
}
if(alpha == iTarget){
clearInterval(timer);
} else {
//alpha += speed;
//div1.style.filter = 'alpha(opacity:'+alpha+')';
div1.style.opacity = (alpha += speed);
}
},30);
}
</script>
</head>
<body>
<div id="div1">
</div>
</body>
</html>
