<!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" /> <title>无标题文档</title> <mce:style><!-- .box{border:#C90 1px solid;width:200px;height:20px; margin:0 auto; position:relative;} .movebox{width:20px;height:20px; background:#9C0; overflow:hidden; position:absolute;left:0} --></mce:style><style mce_bogus="1">.box{border:#C90 1px solid;width:200px;height:20px; margin:0 auto; position:relative;} .movebox{width:20px;height:20px; background:#9C0; overflow:hidden; position:absolute;left:0}</style> </head> <body οnlοad="moves()"> <div class="box" id="box"> <div class="movebox" id="movebox"></div> </div> <mce:script type="text/javascript"><!-- var $ = function(id){ return document.getElementById(id)} $("movebox").style.position = 'absolute'; $("movebox").style.left = 0; function moves(){ var ypos = parseInt($("movebox").style.left) ; if(ypos < 180){ ypos++; } $("movebox").style.left = ypos + 'px'; setTimeout(moves,10); } // --></mce:script> </body> </html> 代码写的不好,有看的朋友欢迎指出问题,谢谢