On the main page ofour Kipdola site is a flash video just under the menu.
When a menu expands, it unfortunately hides behind the flash file. That's incredibly annoying.
I searched for a few fixes. Some suggested to adjust the z-index of the menu, but that still did not work. At least not in Firefox.
And then I found out you actually have to add a few parameters to the object itself.
These, to be precise:
<param name="wmode" value="transparent" />
This goes in the <object> element. For it to work on both Firefox and IE you have to add another one to the <embed> element. Like this:
<embed src="http://some.url/flash.swf" wmode="transparent">
So the video in the showcase section on our frontpage has this code:
<object width="400" height="225">
<param name="wmode" value="transparent" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=11104140&server=vimeo.com&show_title=1&show_byline=1&show_portrait=0&color=00ADEF&fullscreen=1" />
<embed src="http://vimeo.com/moogaloop.swf?clip_id=11104140&server=vimeo.com&show_title=1&show_byline=1&show_portrait=0&color=00ADEF&fullscreen=1"
type="application/x-shockwave-flash"
allowfullscreen="true"
allowscriptaccess="always"
width="400"
height="225"
wmode="transparent">
</embed>
</object>
It also does what it says: makes the flash object transparent. Vimeo, for example, shows a little animation while loading the video. With transparency turned on this isn't drawn on a black background, but directly on your page. Which is pretty
