请大神帮我看一下哪里错了，鼠标经过没有反应
qq_后续_0
2017-03-06 10:03
<html>
<head>
<title>透明度变换</title>
<meta charset="utf-8">
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
div{
width: 300px;
height: 200px;
background: red;
/*filter: alpha(opacity:30);*/
opacity: 0.3;
float: left;
margin-right: 20px;
}
</style>
<script type="text/javascript">
window.onload=function() {
var oDiv=document.getElementsByTagName('div');
for(var i=0;i<oDiv.length;i++){
//oDiv[i].opacity=0.3;
oDiv[i].onmouseover=function(){
startOver(this,0.9);
}
oDiv[i].onmouseout=function(){
startOver(this,0.3);
}
}
}
function startOver(obj,iTarget){
var obj.timer=null;
obj.timer=setInterval(function(){
var speed=(iTarget-obj.style.opacity)/8;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if (obj.style.opacity==iTarget) {
clearInterval(obj.timer);
}else{
obj.style.opacity=obj.style.opacity+speed;
}
},30);
}
</script>
</head>
<body>
<div ></div>
<div ></div>
<div ></div>
<div ></div>
</body>
</html>
1回答
-
- 慕粉1048419981
- 2017-03-06 10:54:01
parseFloat（obj.style.opacity ）返回的是一个浮点数，因为opacity是一个0-1的值。
iTarget-obj.style.opacity算出来也是一个浮点数
speed=speed>0?Math.ceil(speed):Math.floor(speed);你这里再向上向下取整就变成了0 1，所以肯定不会有变化。
把输入的参数变成90 再在var speed 前做一个判断 如果是opacity就用 iTarget-(parseFloat（obj.style.opacity）)*10 然后再取整就没问题了，后面的部分自己注意一下调整吧。
JS动画效果
113925 学习 · 1443 问题
相似问题