Flash Covering Drop Down Menu
For one of the easiest problems to solve, I have seen and heard of some really wacky work arounds.
The issue is typically encountered when working on a horizontal drop down menu, that is directly above a flash header or embeded video. And no matter what z-index you use, the drop-down menu always displays behind the flash.
To solve the problem, all you need to do is add transparency to the flash object or video.
This can easily be done manually by editing the code surrounding the flash header or embeded video.
1.) Add the following parameter to the OBJECT tag:
<param name=”wmode” value=”transparent”>
2.) You must also add the following parameter to the EMBED tag:
wmode=”transparent”
Thats it! That really is all it takes to eliminate the dropdown behind the flash bug. Know of some other work arounds for situations when this doesn’t work out? Find issues with this method? Let me know about it…
4 Comments On This Topic
Leave a Reply
Recent Work
June 6, 2010 at 2:18 pm
Very helpful. Thanks. It works beautifully for IE (7 at least), but doesn't solve the problem for Firefox. Any ideas why?
February 22, 2011 at 9:59 am
Yes. Issues in FireFox result from flash objects receiving a higher default z-index than any other elements on the page. (Don’t know why this happens, but it does, and it’s not universal through all versions of Firefox.) add the following to your pop-up menu tags:
style=”z-index: 99;”
Alternatively, you can just add this info in your CSS style sheet.
Let’s say your dropdown menus are in a tag with a class of drop-dn. Add the following to your CSS file:
.drop-dn {
z-index: 99;
}
In a similar fashion, make the z-index of the object tag and the embed tag equal to 1.
Technically, your numbers don’t have to be so drastic, but since you probably won’t have to set any other z-index properties, why not?
June 6, 2011 at 5:01 am
he doesnt know because this article is just copy & paste
January 12, 2012 at 3:22 pm
I don’t think there is one that works across the board. Anyone know? I sure would like one it would solve a problem I had a few months ago (and changed the design to work around all browsers and ended up avoiding flash in that spot anyway). filthyliberal.com