event handelers as properties; am I useing them right?

[[m]]

ok from reading over the concept I got the idea that I could asign an even to an even handel....ok what are these used for and should it work for what I'm useing it?


<script>
function id(id) {
return (document.getElementById(id));
}

function move(direction) {
if(direction == 'up'){
playerY -= gridSpace;
id('player').style.top = playerY;
}
if(direction == 'down'){
playerY += gridSpace;
id('player').style.top = playerY;
}
if(direction == 'left'){
playerX -= gridSpace;
id('player').style.left = playerX;
}
if(direction == 'right'){
playerX += gridSpace;
id('player').style.left = playerX;
}
if(direction == 'upleft'){
playerX -= gridSpace;
playerY -= gridSpace;
id('player').style.left = playerX;
id('player').style.top = playerY;
}
if(direction == 'upright'){
playerX += gridSpace;
playerY -= gridSpace;
id('player').style.left = playerX;
id('player').style.top = playerY;
}
if(direction == 'downleft'){
playerX -= gridSpace;
playerY += gridSpace;
id('player').style.left = playerX;
id('player').style.top = playerY;
}
if(direction == 'downright'){
playerX += gridSpace;
playerY += gridSpace;
id('player').style.left = playerX;
id('player').style.top = playerY;
}
id('actmenu').style.visibility = 'hidden';
}
id('up').onclick = move;
id('down').onclick = move;
id('left').onclick = move;
id('right').onclick = move;
id('upleft').onclick = move;
id('upright').onclick = move;
id('downleft').onclick = move;
id('downright').onclick = move;

</script>
<div ID="actmenu" name="actmenu">
<div ID="up" class="act" ><IMG SRC="up.gif" ALT=""></div >
<div ID="down" class="act" ><IMG SRC="down.gif" ALT=""></div>
<div ID="left" class="act" ><IMG SRC="left.gif" ALT=""></div>
<div ID="right" class="act" ><IMG SRC="right.gif" ALT=""></div>
<div ID="upleft" class="act" ><IMG SRC="upleft.gif" ALT=""></div>
<div ID="upright" class="act" ><IMG SRC="upright.gif" ALT=""></div>
<div ID="downleft" class="act" ><IMG SRC="downleft.gif" ALT=""></div>
<div ID="downright" class="act" ><IMG SRC="downright.gif" ALT=""></div>
<div ID="coverplay" style="position:absolute;width:32px;height:32;filter:alpha(opacity=1);background:white;"></div>
</div>

[Vincent Puglia]

Hi,

You are having problems for a number of reasons:
First, you are getting a 'null is null or not ...' error message because you are attempting to declare the event handlers before the divs are defined. Secondly, you are assuming the event handler will pass the 'direction'/div id to the move function. It doesn't. if you would like to see an event's properties, run the following code as the first line in your move function:


for (property in object)
alert(property + ' = ' + object[property])


Now, what is wrong with simply having the divs do the work?


<div id="up" class="act" onclick="move('up')" ><img src="up.gif" alt=""></div >


You might be interested in the "Moving Layers" script/tutorial I have at my site (GrassBlade)

Vinny

[cheesebag]

event handelers as properties; am I useing them right?No. :(

http://www.xs4all.nl/~ppk/js/introevents.html
http://www.xs4all.nl/~ppk/js/events_events.html
http://www.xs4all.nl/~ppk/js/events_early.html
http://www.xs4all.nl/~ppk/js/events_tradmod.html
http://www.xs4all.nl/~ppk/js/events_advanced.html
http://www.xs4all.nl/~ppk/js/events_access.html
http://www.xs4all.nl/~ppk/js/events_properties.html
http://www.xs4all.nl/~ppk/js/events_order.html
http://www.xs4all.nl/~ppk/js/events_mouse.html
http://www.xs4all.nl/~ppk/js/events_compinfo.html

[[m]]

thank you for the help. I see now why it wasn't working :p
I think I'm just going to have the DIV do the work afterall.