Create A HTML Page Insert A Image And Button In Page When A Click To A Button Image Should Shifted To Right Until Stop Button

belongs to collection: HTML + Javascript Examples

YasminRadwan26

Save to bookmark

2022-06-01

431

Create A HTML Page Insert A Image And Button In Page When A Click To A Button Image Should Shifted To Right Until Stop Button Not Press

Html programming, JavaScript programming, examples, Html programming examples, JavaScript programming examples,

All Answers

YasminRadwan26

2022-06-01

need an explanation for this answer? contact us directly to get an explanation for this answer

Click.html

<html>
   
   <head>
      <title>JavaScript Animation</title>
      
      <script type="text/javascript">
         <!--
            var img = null;
            var animate ;
            
            function init(){
               img = document.getElementById('myImage');
               img.style.position= 'relative'; 
               img.style.left = '0px'; 
            }
            
            function moveRight(){
               img.style.left = parseInt(img.style.left) + 10 + 'px';
               animate = setTimeout(moveRight,20); // call moveRight in 20msec
            }
            
            function stop(){
               clearTimeout(animate);
               img.style.left = '0px'; 
            }
            
            window.onload =init;
         //-->
      </script>
      
   </head>
   
   <body>
   
      <form>
         <img id="myImage" src="Desert.jpg" height="400" width="600" />
         <p>Click the buttons below to handle animation</p>
         <input type="button" value="Start" onclick="moveRight();" />
         <input type="button" value="Stop" onclick="stop();" />
      </form>
      
   </body>
</html>

Output: