1 <!DOCTYPE HTML>2 <HTML>3 <HeadLang= "en">4 <MetaCharSet= "UTF-8">5 <title></title>6 <style>7 #div1{8 width:200px;9 Height:200px;Ten Background-color:Red; One position:Absolute; A Left:0; - Top:50px; - } the </style> - <Script> - window.onload= function () { - varDiv=document.getElementById ("Div1"); + SetInterval (function () { - Div.style.left=Div.offsetleft+ - + "px"; + }, -); A } at </Script> - </Head> - <Body> - <DivID= "Div1"></Div> - </Body> - </HTML>
Run effect stamp [here]
In the <style> element, set the {position:absolute; left:0; top:50px;} of the #div1 element.
In <script>, the element moves by changing the left value of the element. It is important to note that Offsetleft returns a numeric value, while the Style.left setting requires a unit.
There is more information about [offsetleft], [left], [position] in the MDN, and there is an introduction to offsetleft in my blog.
How do I get JavaScript elements to move up?