Layering DIV's above the map using ExtJS - HowTO

Showing 1-2 of 2 messages
Layering DIV's above the map using ExtJS - HowTO David C. Stuart 4/13/09 2:20 PM
There has been a fair amount of discussion about how to do this on the
board, so I thought I would share this for those interested.

I am currently developing using ExtJS 2.2 (  I had been
designing my UI based on the assumption that DIV's over the map would
not be possible.  Recently I discovered that Ext had built in support
for iframe shims in browsers that require them (older one's, I
assume), and auto detects the browser for enabling/disabling this
feature.  Iframe shims are the way that the layering has been enabled
by some people.  Most notably, Markw65 has an example using the
prototype framework.

So, I dug around, and found that you could force using shims with:

Ext.useShims = true;

This worked but there were still some funky artifacts around the div,
which ended up being the shadow that Ext tries to put on floating
windows. So I disabled the shadow ('shadow: false' in the config of
the window) , and violla, it worked perfectly!  I have both pop-up
type windows, and drop-down menus both working over the map.  I have
tested IE6/7 and FF3 with no problems.
Re: Layering DIV's above the map using ExtJS - HowTO bFlood 4/14/09 5:11 AM
you can disable shadows globally using the following hack

Ext.useShims = true; //automatic IFrame backgrounds
Ext.form.ComboBox.prototype.shadow = false;
Ext.Panel.prototype.shadow = false; = false;

if the GEPlugin ever goes windowless then the above can easily be
turned back on

browsers - agreed, seems to work pretty well in all browsers (I'd add
Chrome to the list too). When I originally tried this with the first
release of the plugin, IE had issues so it seems Goog has changed