Hi all, hopefully many of the designer will face this problem. Most possible case is dropdown menu and flash banner. Both always come near by.

To overcome this issue, there is a possible way by using the code <object> and <embed> simply. I have illustrated the code below.

1
2
3
4
5
6
7
8
9
10
11
12
13

<object classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0 movie="myEncodez.swf" quality="high" wmode="transparent" width="600" height="150" version="8,0,0,0" bgcolor="#ffffff" >
 
   <param name=movie value="myEncodez.swf">
   <param name=quality value="high">
   <param name=wmode value="transparent">
   <param name=width value="600">
   <param name=height value="150">
   <param name=version value="8,0,0,0">
   <param name=bgcolor value="#ffffff">
 
   <embed src="myEncodez.swf" pluginspage=http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash type=application/x-shockwave-flash movie="myEncodez.swf" quality="high" wmode="transparent" width="600" height="150" version="8,0,0,0" bgcolor="#ffffff" >
   </embed>
</object>

Also this is a solution for the Microsoft’s recent security update which was annoying developers and users who faced a message saying “Click to activate and use this control” in all <embed> and <object> s. More info about this security update can be found in here

In contrast, Milonic has released a Javascript function which does the same as above <object> & <embed> tags. The code can be downloaded from here. It is very simple to use the code rather to write full <embed> tag in the HTML file. Thanks to Milonic Solutions.

How to use the Milonic’s Insert Active Flash Javascript file (insert_active_flash.js).

1. Download the file and make a reference at the header part of HTML file.

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

2. Create a Layer using <div> and assign an id for that

1
2

<div id="myFlashDiv">
</div>

3. Use the following code withing the “myFlashDiv” layer which will be later replaced by insert_active_flash script.

1
2
3
4
5
6
7
8
9
10
11
12

<div id="myFlashDiv">
<script>
    myFlashObject=new Object
     myFlashObject.movie="flashfile.swf"
     myFlashObject.quality="high"
     myFlashObject.wmode="transparent"
     myFlashObject.width=850
     myFlashObject.height=550
     myFlashObject.version="5,0,0,0"
 
     commitFlashObject(myFlashObject, "myFlashDiv")
</script></div>

This is it. It is simple right?

When later the flash function execute, it will dynamically replace the above javascript code in to <object> code and will embed the movie using classic method. No worry for us!

2 Responses to “Broblem! Flash object overlapping menus and layers in Firefox and IE”

1. Heath Gehlhausen says:

   November 4, 2009 at 4:22 am

   Please visit site in NON-IE browser. (Not necessary, but safer bet)

   I have had this issue.

   Is your modification the text in pink on the under the in the classid=classid:…- 444553540000 ? If so, is there a way to make Flash (now by Adobe) export this as its class.

   Please explain your solution more fully as well. (specifically say what changed, and why: I missed it the first read-through.)
2. Muneer Shaheed says:

   November 4, 2009 at 8:52 am

   No my dear.. I am sorry I have not emphasized the solution. The actual solution is

   <param name=wmode value=”transparent”>

   Even if you use this tag, in some browsers you will have to make a click on the flash object. Other wise it would be showing a border like selectable box around the object. To over come this all the one in all solution is using Milonic’s Insert Active Flash Javascript file (insert_active_flash.js). This is also have discussed.