onmouseout problem - multiple divs in one area

[edg322]

I've got what at first would seem to be a simple issue to resolve.  I have a js timer that changes content visibility every couple of seconds, all within the same area in a page.  To change the visibility, the javascript simply sets style:visible to one area of content, and sets the rest to hidden.  To accomplish that, I had to have several div tags.  The javascript then sets each div tag to visible or hidden accordingly.  What I want to have happen next is this - when user moves the mouse over that area, the js timer stops, and the current content remains visible, until the click one of a few tabs I have in the top portion of the area, or until they mouseout.  When the user mouses out, the timer should kick in again.

So I have the following code:

[code]<div id="MyMainAreaDiv" onmouseover="javascript:StopTheTimer()" onmouseout="javascript:StartTheTimer()">
<div id="content1" style=(visible or hidden depending on js timer)</div>
<div id="content2" style=(visible or hidden depending on js timer)</div>
<div id="content3" style=(visible or hidden depending on js timer)</div>
</div> <!-- this div closes "MyMainAreaDiv" -->[/code]

This works fine, except for one thing - when the mouse is inside the area, every time it moves one pixel, it thinks it is mousing out of 'MyMainAreaDiv' and mousing back over, again and again, because content1 content2 and content3 all take up exactly the same area within the page.  So when you mouse over the area, it does stop if you stop moving the mouse.  But move the mouse around some within the area, and the content visibility changes very rapidly.  Hopefully I explained it well and left enough code.  Any suggestions appreciated.  I am thinking I may need to write some event listener...  I tried a delay on my javascript StartTheTimer, like a pause of a couple seconds, but that caused all kinds of odd behaviour with the actual js timer functionality ...

[fenway]

Sound like an event bubbling problem.

[emehrkay]

i only read the few few lines of your post...anyway, setting the visiblity to hidden to visible doesnt take that element out of play. i would assume you need to set the display to block and none to do what you're trying to do