This is an old issue, but I've searched and searched and haven't yet found a suitable workaround for the issue.
I have a flex app with a requirement to have a HTML popup (the HTML I need to display is generated from a 3rd party server), so have used a Flex iFrame to display it. My issue is that the layering of older browsers requires the wmode="opaque", but when i do this my textboxes stop receiving keyboard input in Safari.
Does anyone know of a working solution for this problem?
I've found different solutions, but none have yet worked for me:
- positioning HTML input forms in the exact position as the Flex input forms. Unfortunately this is not an option for the app i'm working on as its too big and has hundreds of textboxes.
- Setting the focus back to the app on key-down, no luck -> http://www.igorcosta.org/?tag=flex-hacks
- Someone suggested on Stack that maybe MXFTETextInput may work, so also tried this, no luck.
Thanks for any help you can give!
I'm going to answer my own question based on my research into the issue:
Adobe does not provide a supported way to embed HTML inside Flex applications. Flex iFrames are a popular but unsupported way to view HTML positioned above applications by using a special windowing mode (wmode opaque) on the Flash Player. The opaque wmode takes layering and compositing into consideration, but a big problem with this wmode is the inconsistent performance of the Flash Player across different browsers. There are a number of documented issues across Firefox and Safari that occur when this wmode is used.
This was a really helpful and informative post -- it also provides some theoretical solutions if you want to spend the time implementing them --- http://www.deitte.com/archives/2008/07/dont_use_iframe.htm