mouseleave is triggering in IE7 while the cursor is still over the element

I'm using mouseleave to close a popup menu. This works correctly in all of my target browsers except IE7. In IE7, mouseleave triggers while the cursor is clearly still over the target element. I've highlighted the main container for the popup in yellow below. If I position the mouse as shown and move it a bit (still within the yellow), mouseleave is triggered on the yellow containing element. Any ideas about what's going on here? What might cause mouseleave to be trig开发者_如何学Cgered on an element when the cursor was still visibly inside it?

After looking closer, I see that the mouseleave event is triggered even when the cursor is over the opaque part of the popup.

transparent tag.

quick fix - having 1x1.gif as background.

other option would be time triggered mouseleave

The mouseleave event gets triggered any time JavaScript moves from an element onto another element that is not below the registered element in the page hierarchy. Is it possible that the browser believes you are moving onto the element that makes up the menu that exists physically below the popup (i.e., has a lower z value)?

In my case code below solved the IE7 jquery mouseleave problem:

"position" : "relative";
"z-index" : 2000;

My tag had background gif image but that wasn't succeed. Only setting that css i have got expacted behaviour.

I was able to explicitly define the background.

The 1x1 transparent gif also works if this doesn't.

.content { /* IE-8: mouseleave/mouseenter fires when you hit the background, so this needs to be explicitly declared*/ background: white; }