[thelist] mouseover + set/clearInterval concerns

[Barney Carroll]

Hello, list!
I'm building a drop-down menu system whereby sub-menus fade in and out on
mouseover/out and I'm facing a bit of a DOM problem as well as a few JS
programmatic errors I don't quite understand. To my mind these would be
common issues (it's a fairly standard concept), but googling reveals nothing
relevant, so I was hoping people here might have resolved similar issues.

The test page is here: http://barneycarroll.com/work/ed

1) The mouse moving into the area of the revealed sub menu triggers a
mouseout of the containing li. I'm pretty stumped by this, especially as the
revealed sub-menu's elements are within the metric scope of their parents at
all times. Does anybody know why this is or have any idea how to go about
avoiding it?

2) If the user ends up in the situation above, or triggers either of the
events while the other's setInterval is still running, the fadeIn and
fadeOut setIntervals seem to run simultaneously, which means neither can
resolve as both rely on either reaching the end state of their actions or
being interrupted by the other in order to end. I'm pretty confused by this
since I've explicitly told both actions to clearInterval the other once
triggered, but obviously this isn't happening.

Any tips? I'd be grateful for any insight.


Regards,
Barney Carroll
Web designer & front-end developer

t: +44 (0) 7594 506 381