- 【多个运动】函数哪里错了？
-
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title></title> <style> div { width: 100px; height: 50px; background-color: red; margin-top:50px; } </style> <script type="text/javascript"> window.onload=function() { var aDiv = document.getElementsByTagName('div'); for(let i=0;i<aDiv.length;i++) { aDiv[i].timer = null; aDiv[i].onmouseover = function () { startMove(this,300); } aDiv[i].onmouseout = function () { startMove(this,100); } } } function startMove(obj,iTarget) { clearInterval(obj.timer); timer=setInterval(function () { var iSpeed = (iTarget - obj.offsetWidth)/8; iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed); if(obj.offsetWidth == iTarget) { clearInterval(obj.timer); } else { obj.style.width = obj.offsetWidth + iSpeed + 'px'; } },30) } </script> </head> <body> <div></div> <div></div> <div></div> </body> </html>
