請大神幫我看一下哪里錯了,鼠標經(jīng)過沒有反應
<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>
2017-03-06
parseFloat(obj.style.opacity?)返回的是一個浮點數(shù),因為opacity是一個0-1的值。
iTarget-obj.style.opacity算出來也是一個浮點數(shù)
speed=speed>0?Math.ceil(speed):Math.floor(speed);你這里再向上向下取整就變成了0 1,所以肯定不會有變化。
把輸入的參數(shù)變成90 ?再在var speed 前做一個判斷 ? 如果是opacity就用 ?iTarget-(parseFloat(obj.style.opacity))*10 ? 然后再取整就沒問題了,后面的部分自己注意一下調(diào)整吧。