[CLOSED] menu mouse out issue

[UGRev]

What i have is a menu with a component menu item which holds a grid. I'm trying to have it so that on mouse out, the mouse out event handler handles some biz logic and hides the menu. My problem is that mouseout fires when I mouse over the grid. This is not my desired affect. I do not want the mouseout event to fire until I've moved outside the "area" which is occupied by the menu populated by the grid.

I've tried mouse out on the grid, but that fires if I mouse over a different column header (?shrug?).

[Vladimir]

Hi,

It is not so easy (atleast I didn't find acceptable solution)
Try the following

1. Define js function on the page

function hideMenu(e, t){
            if(!e.within(this.ul)){
                this.hide();
            }
        }

2. Add Listeners to the menu

<MouseOver Handler="Ext.getBody().on('mouseover', hideMenu, this, {buffer:250});" />
            <Hide Handler="Ext.getBody().un('mouseover', hideMenu, this);" />

[UGRev]

That seems to work. I will test it further to make sure. Thanks :)

[UGRev]

this actually ended up not working for us because mouse out fired repeatedly as I left the menu even though it didn't hide the menu. We've tabled this for now.