Facebook connect overlays are covered by Flash

Facebook Connect uses JS/CSS overlays/popups for user interaction. I have sites with Flash elements, and no matter how I set the z-indices, the Flash always seems to go to the top.

I have a similar and likely related problem with a div with display:fixed at the top of the screen, where it gets covered by the Flash when you start scrolling.

How can I make sure the Fl开发者_StackOverflowash element layers properly?

If you just need your flash to fall behind other object then you should use wmode=opaque. This will correct the z-index.

wmode=transparent will also correct the z-index but it also makes your stage transparent so whenever you have nothing on the stage or gaps between objects your html will show through underneath. This in turn causes more system strain.

Ergo if you just need the z-index correcting use wmode=opaque

Generally, I've needed to set the wmode=transparent property on the Flash object and/or embed string.

http://www.communitymx.com/content/article.cfm?cid=e5141