Menu showing over Iframe

[evant]

I have a border layout with a north and center region. The north region contains a toolbar button with a menu, the center region contains a series of iframes. When you expand the menu, it appears over the iframe fine, however if you click anywhere that isn't the menu itself or the north panel, the menu doesn't hide.

I've tried the following things:
1) Binding a click event to the iframe element
2) Binding a click event to the document.body of the main page

I don't want to have to bind a click event inside each iframe to fire an event in the parent window. Is there any easy to do this?

Cheers.

[evant]

Bump, anyone?

[evant]

If anyone is interested, I have a partial (but quite poor) solution.



if (Ext.isIE)
{
el.on('activate', function()
{
//hide menu;
}
);
}
else
{
el.on('load', function()
{
Ext.get(el.dom.contentDocument.body).on('click', function()
{
//hide menu
}
);
}, this);
}


However, if someone has a better solution I'd like to hear it because mine sucks.

[jratcliff]

I'm having the same issue: a menu in the north region of a BorderLayout that displays over an iframe in the center region.

@evant - the code you are using, where are you putting that?

[evant]

That code goes outside the frame. It binds an event handler for the iframe click or activate.