Saturday, 23 April 2016

Create A HTML Page Insert A Image And Button In Page When A Click To A Button Image Should Shift To Right With 10 Px Value

Create A HTML Page Insert A Image And Button In Page When A Click To A Button Image Should Shift To Right With 10 Px Value  

Code Start here

Click.html

<html>
   
   <head>
      <title>JavaScript Animation</title>
      
      <script type="text/javascript">
         <!--
            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="Desert.jpg" height="400" width="600" />
         <p>Click button below to move the image to right</p>
         <input type="button" value="Click Me" onclick="moveRight();" />
      </form>
      
   </body>
</html>

Output:-

www.programmingwithbasics.com

After Clicking 30 Time Image Reach Next Point Approx 300 Px

www.programmingwithbasics.com

No comments:
Write comments

Recommended Posts × +