Tips for fixing flash movies that "float" above other page elements, including dropdown menus and enlarged/slideshow images.
Flash animations tend to display on top of all other elements on the page, sometimes obscuring elements that should appear above them. For example, dropdown menus and the image enlargement/slideshow features can sometimes be hidden by Flash animations included in your custom page template.
In many cases, this can be avoided by adding a wmode parameter to the HTML for the Flash object, which allows other objects to display on top of the Flash animation.
If your Flash object has <param> tags, add a wmode param tag like so:
<param name="wmode" value="transparent" />
...and if your Flash object uses an <embed> tag make sure that it likewise includes wmode="transparent" among its attributes, for example:
<embed src="flash.swf" quality="best" wmode="transparent" ... >
Say that your template includes the following HTML to embed a Flash animation into your page:
<object type="application/x-shockwave-flash
data="flash.swf" width="400" height="300">
<param name="movie" value="/flash/movie.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="/flash/movie.swf"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer"
quality="high" bgcolor="#ffffff" align=""
width="550" height="400"></embed>
</object>
You would add a new <param name="wmode"> tag and add the wmode="transparent" attribute to the <embed> tag, with this result:
<object type="application/x-shockwave-flash
data="flash.swf" width="400" height="300">
<param name="wmode" value="transparent" />
<param name="movie" value="/flash/movie.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="/flash/movie.swf"
wmode="transparent"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer"
quality="high" bgcolor="#ffffff" align=""
width="550" height="400"></embed>
</object>