这个JavaScript的淡入淡出为什么无法实现？
<!DOCTYPE html>
<meta charset="utf-8">
<head>
<title></title>
<style type="text/css">
#div1{width: 200px; height: 200px; background-color:red; filter: alpha(opacity:30); opacity: 0.3;}
</style>
<script type="text/javascript">
window.onload = function()
{
var oDiv1 = document.getElementById('div1');
oDiv1.onmouseover = function()
{
startMove(100);
}
oDiv1.onmouseout = function()
{
startMove(30);
}
}
var timer = null;
var alpha = 30;
function startMove(iTarget)
{
var oDiv1 = document.getElementById('div1');
clearInterval(timer);
timer = setInterval(function()
{
var speed = 0;
if (alpha<iTarget)
{
speed = 10;
}
else
{
speed = -10;
}
if (alpha==iTarget)
{
clearInterval(timer);
}
else
{
alpha += speed;
oDiv1.style.filter = 'alpha(opacity:'+alpha+')';
oDiv1.style.filter = alpha/100;
}
},30);
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
简若婷3回答
-
后知后觉88
写代码要认真点....
随时随地看视频慕课网APP
Html/CSS
JavaScript
前端工具