Expanding Flash in HTML covering text links in Firefox, Chrome, Opera

Question

I have a piece of Flash on an HTML page that when you hover over it, it expands out to reveal more information.

There are text links that it expands over, however in everything but IE, when it's not expanded those links are still covered by the Flash making them unclickable.

I have the Flash piece in a separate DIV wmode set to transparent.

I know this is possible to make work but for the life of me, I can only get it to work in IE.

Does anyone have any idea of what I'm missing?

Thanks.

Answer 1

I'm a little confused by what you're looking for, so I'll give you a couple of areas to look into. With luck, one of these will get you going, but otherwise, feel free to ask more questions. I'm a little slow on the uptake sometimes....

First off, by default, most browsers place flash files in the uppermost layer. So, the links that you cannot click are stuck in behind your flash presentation - basically, in the eyes of the browser, you are actually clicking on the flash presentation!

This article has some good information on this:

http://kb2.adobe.com/cps/155/tn_15523.html

But basically, you can use a parameter called WMODE in both the object and embed tags. For example, you could implement it like this:

and then add wmode="transparent" into your embed tag.

However, to make it smooth across all browsers (and to make the code a little easier to read/follow), you should also add some z-index values to your stylesheet.

I hope this helps a bit. If not, remember, I'm slow on the uptake....:-)