Getting mouseevents to work the way I want 1

[Zac5]

Hi all,

I am dynamically generating a variable number of tables containing statistics. As the page loads the tables are hidden using the getElementById('xx').style.display='none' feature. Each table is within a pair of <div> tags with a unique ID. On another part of a page I have dynamically generated images relating to each table. I use the getElementById('xx').style.display='inline' to show tables. This is how I want the mouse events to work:
when you first onmouseover an image the table corresponding to the image is shown, when you mouseout the table becomes hidden, however as soon as you click on an image the corresponding table is shown until you click on another image at which point the current table is hidden and the new table is shown. The problem I am having is that onmouseout and onmouseover are overriding my onclick events, please can someone suggest solution.

Many thanks,

Zac

 

[13sio]

set a flag in onClick events, e.g., flag=1 indicates that the table is shown, flag=0 indicates that the table is hidden; check the flag in onMouseOver event & onMouseOut event and operate correspondingly.