<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; Charset=utf-8 "/> <title>javascript Object Translational Motion effects </title> <style> #div1 {background:red URL (yun_qi_ Img/logo.gif); Position:absolute; left:50px; top:50px; width:200px; height:200px;} </style> <script type= "Text/javascript" > var g_otimer=null; function Startmove () {if (!g_otimer) {g_otimer=setinterval (Movetimerhandler, 30); } function Movetimerhandler () {var Odiv=document.getelementbyid (' Div1 '); var ispeed=5; if (odiv.offsetleft>=300) {clearinterval (G_otimer); G_otimer=null; else {odiv.style.left=odiv.offsetleft + ispeed + ' px '; } window.onload=function () {var Obtn=document.getelementbyid (' Btn_start_move '); Obtn.onclick=startmove; }; </script> </pead> <body> <div id= "Div1" ></div> <input id= "btn_start_move" type= "button" value= "Start movement"/> </b Ody> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
