PDA

Click to See Complete Forum and Search --> : moving objs

HiDeWaY
08-22-2003, 09:05 PM
im making a page and i need to move a <img> around the page!

what methods do i have to use to move a <img> around the screen?
AdamBrill
08-22-2003, 09:57 PM
I don't know if this is what you meant, but try this:<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
keys = new Array();
capturekeys="73,74,75,76"; //keys to capture
speed=5; //pixels to move by
//lower makes it run faster...
timeout=30; //time to wait in between running
//lower makes it run faster...
function key_down(event){
if(capturekeys.indexOf(event.keyCode) != -1){
if(keys.toString().indexOf(event.keyCode) == -1){
keys[keys.length]=event.keyCode;
}
}
}
function move_main(){
element=document.getElementById('pic_id');
for(y=0; y<keys.length; y++){
switch(keys[y]){
case 73:
element.style.top=parseInt(element.style.top)-speed;
break;
case 74:
element.style.left=parseInt(element.style.left)-speed;
break;
case 75:
element.style.top=parseInt(element.style.top)+speed;
break;
case 76:
element.style.left=parseInt(element.style.left)+speed;
break;
}
}
}
function key_up(event){
for(x=0; x<keys.length; x++){
if(keys[x]==event.keyCode){
keys.splice(x,1);
break;
}
}
}
</script>
</head>
<body onkeydown="key_down(event);" onkeyup="key_up(event)" onload="setInterval('move_main()',timeout);">
<img src="whatever.gif" id="pic_id" style="position:absolute; top:0px; left:0px;">
</body>
</html>You can move the image around using the "i" "j" "k" "l" keys...
HiDeWaY
08-22-2003, 10:13 PM
it was exacly what i meant :)

tks a lot! :cool:
AdamBrill
08-22-2003, 10:17 PM
No problem. I'm glad I could help. :)