weibo_猪猪猪惠婷_0
2016-10-10 20:07
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>多物体运动</title> <style type="text/css"> *{ padding: 0; margin: 0; } ul,li { list-style: none; } ul li { width: 200px; height: 100px; background: yellow; margin-bottom: 20px; } </style> <script type="text/javascript"> window.onload=function(){ var aLi=document.getElementsByTagName('li'); for(var i=0;i>aLi.length;i++){ aLi[i].timer=null aLi[i].onmouseover=function(){ startMove(this,400); } aLi[i].onmouseout=function(){ startMove(this,200); } } } //var timer=null; function startMove(obj,iTarget){ clearInterval(obj.timer); obj.timer=setInterval(function(){ var speed=(iTarget-obj.offsetWidth)/8; speed=speed >0?Math.ceil(speed):Math.floor(speed); if(obj.offsetWidth==iTarget){ clearInterval(obj.timer); }else{ obj.style.width=obj.offsetWidth+speed+'px'; } },30) } </script> </head> <body> <ul> <li></li> <li></li> <li></li> </ul> </body> </html>
程序的第24行
应该是小于号
for(var i=0;i<aLi.length;i++){
JS动画效果
113925 学习 · 1443 问题
相似问题