Can I make a Flash/Flex Drop Down Extend outside the flash object boundaries?

We are developing our app in flash/flex builder for the front end hitting .NET backend webservices. There is one section of the old app that will not be initially converted, so we need have it appear in an iFrame.

So far all that works fine.

We shrink the size of the SWF in the host page to just be the menu/nav area. And underneat that I have an iframe control that loads in this page from the old site.

Now the problem. in the SWF is a drop down list to enable picking a client. Since the SWF has been shrunk to about 100px high, the drop-down will only occupy within that 100px area which it's opened. This is NOT good as you can imagine.

So the question is. How can I make the drop-down list descend over-top of the IFRAME control and thus extend outside the SWF dimensions? Is this possible?

I tried to make开发者_如何学Python the internal stage transparent and leave the SWF a little larger, about 400 px high, but the IFRAME still appears behind the SWF.

Any suggestions on how to do this would be MUCH appreciated!

The quick answer is make your Flash movie 500px (or whatever) and then use wmode to make its background transparent. Then when you open the drop down, it appears over the IFRAME.

Now, the problem with wmode is that last time I checked it was coming with a nightmare of side effects in anything that is not Windows + IE combination.

Performance lost, problem with non English keyboards, weird tab indexes...

So basically you need to make a decision between pros and cons. If you happen to have an audience with a significant amount of Firefox, Mac or Linux, then you are screwed, that people is going to have problems with the site.

My advice is NEVER use wmode, it's not worth it. But you might be late for affording a new design for the site.

Good luck!

J

Google code has a flex-iframe component

http://code.google.com/p/flex-iframe/

It provide a nice feature to autohide the iframe when a popups like menu are show when overlayDetection="true" is set to true

source="www.google.com" width="100%" height="100%" />

In case you dont want to use the component you I have looked into the code.