关于alpha>iTarget的问题想问下大家
来源：2-2 JS透明度动画
浪里白嫖张顺
2017-07-11 15:07
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>透明度</title>
<style>
*{
margin:0;padding:0;
}
#div{
width:300px;height:200px;background:red;filter:alpha(opacity:30);opacity:0.3;
}
</style>
</head>
<script>
window.onload=function(){
var onDiv=document.getElementById('div');
onDiv.onmouseover=function(){
startmove(100);
}
onDiv.onmouseout=function(){
startmove(30);
}
}
var timer=null;
alpha=30;
function startmove(iTarget){
var onDiv=document.getElementById('div');
clearInterval(timer)
timer=setInterval(function(){
var speed=0;
if(alpha>iTarget){
speed=-10;
}else{
speed=10;
}
if(alpha==iTarget){
clearInterval(timer);
}else{
alpha+=speed;
onDiv.style.filter='alpha(opacity:'+alpha+')';
onDiv.style.opacity=alpha/100;
}
},30)
}
</script>
<body>
<p id="div"></p>
</body>
</html>老师在讲alpha>iTarget我其实是有点懵的，因为我看了下已经定义了alpha=30，并且iTarget在30-100之间徘徊的，那我应该怎么去理解这句话？
写回答
关注
2回答
-
- 香宝的夫差
- 2017-07-15 09:08:19
你这样想：iTarget是个定值（30，100）；
alpha是一个随时间变化而变化的值，即所对应的颜色深浅。
当alpha>iTarget时，是不是iTarget只能取30，这个不等式才能有效。即他的目标值是30，是不是颜色要变浅啊，颜色变浅是不是要给alpha值递减啊，递减的话，只能加一个负数吧。
你画一个数轴，标出alpha与iTarget就比较明显
-
- qq_终究落下_04415476
- 2017-07-12 08:49:12
这是鼠标移入，目标值从100转向30所以要负数
JS动画效果
通过本课程JS动画的学习，从简单动画开始，逐步深入各种动画框架封装
113925 学习 · 1443 问题
相似问题