<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> #div1{ width:300px; height:300px; position:absolute; left:-200px; background:red;} </style> <script> window.onload = function(){ var odiv = document.getElementById('div1'); odiv.onmouseover = function(){ move(0); } odiv.onmouseout = function(){ move(-200); } } var timer = null; function move(itarget){ clearInterval(timer); var odiv = document.getElementById('div1'); timer = setInterval(function(){ var speed = 0; if(oidv.offsetLeft>itarget) { speed = -10; } else { speed = 10; } if(odiv.offsetLeft==itarget) { clearInterval(timer); } else { odiv.style.left = odiv.offsetLeft+speed+'px'; } },30) } </script> <title>无标题文档</title> </head> <body> <div id="div1"></div> </body> </html>
MarlboroKay