Joomla & WordPress Tutorials, Info, Discussion, Tips | GavickPro Blog

CSS Menus and Flash objects – how to fix it

It seemed like a simple task to add banner module with flash ad under the menu, but in IE browser he banner content concealed part of the position from the dropdown menu. I have tried setting the z-index of the object, but still there was something wrong.

By default, browsers place embedded plug-in content, such as a SWF file or Java applet, on the topmost layer. In older browsers, attempts to place a DHTML layer on top of a Flash layer fail. Newer browsers add the ability to layer rich media content with DHTML content. Thus, the change should affect mainly the code that displays the flash animations.

Use the WMODE parameter to allow layering of rich media content with DHTML layers. The WMODE parameter can be “window” (default), “opaque,” or “transparent.” Using a WMODE value of opaque or transparent prevents a SWF file from playing in the topmost layer. And, it allows you to adjust the layering of the movie within other layers of the HTML document. The WMODE parameter is supported only on some browser/Flash Player version combinations. If the WMODE parameter is not supported, the SWF files always displays on top.

That why you should always remember to add some extra code line:


<param name=wmode value="opaque">

and for example: WMODE=”transparency”  in <EMBED ….

or if you insert flash by SWFObject: swf.addParam(“wmode”, “transparent”);

It will help you also if you are using Lightbox effects with your images and swf files could break the magic effect (modal window). Remeber if you are using a Banner component in Joomla you can also add those code line or modify the code received from a trading partner. This “trick” should work with both IE and Opera browser.

Share