Floating DIV Above Embedded Flash Object

This simple tips will help you make your division float above flash object or flash player embedded on your website. When you embed a flash object or flash player on your website, the flash object will take the highest number possible z-index by default and all the other division layer will appear below the flash object. Actually this property of embedded flash object is quite useful in most cases. However when you want some text or division to appear on top of your flash object, you need this tips to fix that issue. You have three options to fix this floating issue.

First option is to compile/recompile your flash object with the parameter ‘wmode‘ value set to ‘opaque‘. However, in most cases, we normally get a precompiled flash object rather than the source flash file. In such cases the second option will be more suitable. Second option is to add a parameter in your flash object as shown in example below

<object>
	<param name="bgcolor" value="#FFFFFF" />
	<param name="width" value="670" />
	<param name="height" value="390" />
	<param name="wmode" value="opaque" />
</object>

Third option is to add an attribute ‘wmode’ with value set to ‘opaque’ in the object file. After performing any one these, your flash player or flash object will float below <DIV> having higher z-index.

Leave a Reply