DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets has posted 5883 posts at DZone. View Full User Profile

Javascript Motion Tween

10.30.2006
| 6902 views |
  • submit to reddit
        // description of your code here
// Motion tween 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

  <script type="text/javascript">
      var pos=0;

        function move(){
            pos = 0;
            changeInnerHtml();
            setTimeout('move()',1000);
            pos = 0 ;

        }

        function changeInnerHtml()
        {

              pos = pos +5;
              document.getElementById('spid').style.visibility = 'hidden';
//              document.getElementById('div1').style.visibility = 'hidden';

              if( pos <= 200 )
              {

                  document.getElementById('b1').style.left = pos + 'px';
                  setTimeout("changeInnerHtml()",10);

              }

              
           }
          

                    
//            document.getElementById('div1').innerHTML = '';
//            document.getElementById('div1').innerHTML = '<input type = "text" name = "hi" />' ;                      }
       

  </script>

  <style type="text/css">
      .divstyle
      {

         width:50px;
         height:50px;
         position:relative;
         left:100px;
         border:1px;
         visibility:visible;

          
      }
      
  </style>
  <title></title>
</head>
<body>

    <div id="div1">
        <span id="spid" class="divstyle">
            hi
        </span>
        <input type="submit" id="b1" name="b1" onclick="move()" class="divstyle"/>
        <iframe id="iframe1" class="div1" >
            
        </iframe>
    </div>

</body>
</html>