z921129H
2016-04-09 15:29
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
*{margin:0; padding:0}
#div1{width:200px; height:200px; background:red; filter:alpha(opacity:30); opacity:0.3}
</style>
<script>
window.onload=function(){
var Odiv=document.getElementById("div1")
Odiv.onmouseover=function(){
startMove(100);
}
Odiv.onmouseout=function(){
startMove(30);
}
}
var timer=null;var alpha=30;
function statrMove(target){
var Odiv=document.getElementById("div1");
clearInterval(timer);
timer=setInterval(function(){
var speed=0;
if(alpha>target)
{speed=-10;}
else
{speed=10;}
if(alpha==target)
{clearInterval(timer)}
else
{alpha=alpha+speed;//aipha+=speed
div.style.filter="alpha(opacity:"+alpha+")";
Odiv.style.opacity=alpha/100}},30)
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
我也是初学者,你的那个if(alpha==target)中的alpha不是当前的透明度啊
JS动画效果
113925 学习 · 1443 问题
相似问题