Friday, 25 July 2014

HTML Program to move a object

HTML  Program to move a object


<html>
<head>
<title>
moving objct
</title>
<script>

function left(id) {
    var y = '5';
    var z =document.getElementById(id).style.left;
    var x = parseInt(y)+parseInt(z);
    var state = document.getElementById(id).style.left;
        if (state == '1') {
            document.getElementById(id).style.left = x;
        } else {
            document.getElementById(id).style.left = x;
        }
    }


function right(id) {
    var y = '5';
    var z =document.getElementById(id).style.right;
    var x = parseInt(z)-parseInt(y);
    var state = document.getElementById(id).style.right;
        if (state == '1') {
            document.getElementById(id).style.right = x;
        } else {
            document.getElementById(id).style.right = x;
        }
    }



function up(id) {
    var y = '5';
    var z =document.getElementById(id).style.bottom;
    var x = parseInt(y)+parseInt(z);
    var state = document.getElementById(id).style.bottom;
        if (state == '1') {
            document.getElementById(id).style.bottom = x;
        } else {
            document.getElementById(id).style.bottom = x;
        }
    }



function down(id) {
    var y = '5';
    var z =document.getElementById(id).style.top;
    var x = parseInt(y)+parseInt(z);
    var state = document.getElementById(id).style.top;
        if (state == '1') {
            document.getElementById(id).style.top = x;
        } else {
            document.getElementById(id).style.top = x;
        }
    }



document.onkeyup = KeyCheck;      
function KeyCheck() {

 var KeyID = event.keyCode;

  switch(KeyID)
  {

  case 37:

  right('img');

  break;

  case 38:

  up('img')

  break

  case 39:

  left('img');

  break;

  case 40:

  down('img');

  break;
  }
  }
</script>
</head>
<body>


<img id="img" src="C:\Users\INDIA\Desktop\gun-pistol-hi.png"   width="20px"height="20px" style="position:absolute; left:-1; bottom:1; right:1; top:-1;">

</body>
</html>

No comments: