View Full Version : Event Handler Problems

08-14-2005, 06:28 PM
I am building a JavaScript board game. The 8x8 board is a table whose cells will contain GIF images. Each cell must fire the 'onclick', 'onmouseover' and onmouseout events. When there is not an image in the cell the events fire as they should, but when an image is in the cell, the 'onmouseover' and 'onmouseout' events fire twice. I imagine that they are fireing as the mouse is over the cell, then out of the cell and finally over the image.
Here is the HTML for two of the cells.

<td id="mvt20" onclick="mCK(this.id);" onmouseover="mOV(this.id);"
onmouseout="mOU(this.id);"><img src="images/othello/black.gif" /></td>
<td id="mvt21" onclick="mCK(this.id);" onmouseover="mOV(this.id);"

To test the event handlers they invoke the document writeln method to write the name of the event handler and the cell ID.
Any suggestion on how to solve this problem would be greatly appreciated. Thanks in advance.

08-14-2005, 06:44 PM
This might not be the best solution, but might give you the results you want. Perhaps move the events to the images and out of the cells. Create a blank.gif the size of your cells for empty cells (or a gif the same color as your cell background). Then have your event handlers swap the images as needed. Hope this is feasible for you.


08-14-2005, 09:10 PM
Dear BaldEagle,

Your suggeston is looking great; it solved my puzzlement. :thumbsup: