Saturday, 23 April 2016

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

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 

NOTE:- When Double Click On Start Button It Speed Should Be Double As So On 

Code Start Here

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:-

www.programmingwithbasics.com


www.programmingwithbasics.com

No comments:
Write comments

Recommended Posts × +