为什么我的没有任何效果呢。。
张筱诺8983
2015-12-09 21:56
<!DOCTYPE html>
<html>
<head>
<title>多物体透明度</title>
<style type="text/css">
div{
background-color:yellow;
height:200px;
width:200px;
margin:20px;
float:left;
opacity:0.3;
filter:alpha(opacity:0.3);
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<script type="text/javascript">
window.onload=function(){
var oDIV=document.getElementsByTagName('div');
for (var i = 0; i < oDIV.length; i++) {
oDIV[i].alpha=30;
oDIV[i].onmouseover=function(){
onMove(this,100);
}
oDIV[i].onmouseover=function(){
onMove(this,30);
}
}
}
function onMove(obj,iTarget){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var speed=0;
speed=(iTarget-obj.alpha)/10;
if (obj.alpha==iTarget) {
clearInterval(obj.timer);
}
else{
obj.alpha+=obj.speed;
obj.style.opacity=obj.alpha/100;
obj.style.filter="alpha(opacity:"+obj.alpha+")";
}
},30)
}
</script>
</body>
</html>
2回答
-
- 李晓健
- 2015-12-09 22:20:20
<!DOCTYPE html> <html> <head> <title>多物体透明度</title> <style type="text/css"> div{ background-color:yellow; height:200px; width:200px; margin:20px; float:left; opacity:0.3; filter:alpha(opacity:0.3); } </style> </head> <body> <div></div> <div></div> <div></div> <div></div> <script type="text/javascript"> window.onload=function(){ var oDIV=document.getElementsByTagName('div'); for (var i = 0; i < oDIV.length; i++) { oDIV[i].alpha=30; oDIV[i].onmouseout=function(){ onMove(this,100); } oDIV[i].onmouseover=function(){ onMove(this,30); } } } function onMove(obj,iTarget){ clearInterval(obj.timer); obj.timer=setInterval(function(){ var speed=0; speed=(iTarget-obj.alpha)/10; if (obj.alpha==iTarget) { clearInterval(obj.timer); } else{ obj.alpha+=speed; obj.style.opacity=obj.alpha/100; obj.style.filter="alpha(opacity:"+obj.alpha+")"; } },30) } </script> </body> </html>你两个事件都写成 onmouseover
obj.alpha+=speed; 这一行是speed，不是obj.speed
-
- xue111
- 2015-12-29 19:59:32
for (var i = 0; i < oDIV.length; i++) {
oDIV[i].alpha=30;
oDIV[i].onmouseover=function(){
onMove(this,100);
}
oDIV[i].onmouseover=function(){
上面最后一行应该为oDIV[i].onmouseout=function(){else{
obj.alpha+=obj.speed;
上面最后一行应该为：obj.alpha+=speed;
JS动画效果
113925 学习 · 1443 问题
相似问题