How to solve "Flash overlaps drop-down menu or any other HTML element"

Sometimes we use drop-down menus that expand with a transparent background when the user hovers it, they look great. The problem is when we also add a Flash movie near the expanded area of the drop-down menu, Flash movie overlaps this menu.

To solve this we need to set the wmode parameter to transparent. If we are using the <object> tag then we do something like this:

<object ... >
<param name="wmode" value="transparent" />
<param name="movie" value="flash.swf" />
<param name="quality" value="high" />
<embed src="flash.swf" quality="high" wmode="transparent" pluginspage="" type="application/x-shockwave-flash" width="50" height="50"></embed>

And if we are using SWFObject script:

<script type="text/javascript" src="swfobject.js"></script>

<div id="flashcontent">
Replaced by the Flash movie.

<script type="text/javascript">
var so = new SWFObject("movie.swf", "ourmovie", "400", "200", "8", "#336699");
so.addParam("wmode", "transparent");