如何在JavaScript中实现基本动画？

要在JavaScript中实现基本的Animation，请使用DOM对象属性和JavaScript。以下列表包含不同的DOM方法。

我们正在使用JavaScript函数getElementById()获取DOM对象，然后将其分配给全局变量 imgObj。
我们已经定义了一个初始化函数init()来初始化 imgObj，我们必须在其中设置其position 和left 属性。
在窗口加载时，我们正在调用初始化函数。
最后，我们调用moveRight()函数将左距离增加10个像素。您还可以将其设置为负值，以将其移至左侧。

<html>
   <head>
      <title>JavaScript Animation</title>
      <script>
         <!--
         var imgObj = null;
         function init() {
            imgObj = document.getElementById('myImage');
            imgObj.style.position= 'relative';
            imgObj.style.left = '0px';
         }
         function moveRight() {
            imgObj.style.left = parseInt(imgObj.style.left) + 10 + 'px';
         }
         window.onload =init;
         //-->
      </script>
   </head>
   <body>
      <form>
         <img id="myImage" src="/images/html.gif" />
         <p>Click button below to move the image to right</p>
         <input type="button" value="Click Me" onclick="moveRight();" />
      </form>
   </body>
</html>

基础教程