Flash and JavaScript Conflict: Javascript Menu goes behind the flash file
Sometimes if you use flash and javascript on the same page, you will have some problem with your layers or javascript. The most common problem is that the javascript menu or other control goes behind the flash file. I am sure you have tried many things like changing the z-index or putting flash more down but the solution is simpler than that. How? You have to make your flash transparent and everyting will be okay.
Browsers that support flash transparency:
Internet Explorer 3 or higher (Windows)
Internet Explorer 5.1 or higher (Macintosh)
Netscape 7.0 or higher
Mozilla 1.0 or higher
AOL
CompuServe
There are two ways to make flash file transparent, one is to export as a transparent file when you are publishing from Macromedia Flash and another to insert a line of code in the HTML. We will cover both ways in this tutorial.
First Method
Open the source code of your page and you will see a code similar to the following:
| CODE |
|
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="200" height="100"> <param name="movie" value="images/trans.swf"> <param name="quality" value="high"> <embed src="images/trans.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="200" height="100"></embed> </object> |
Add the bolded part of the following code into your code. The result should look like the following
| CODE |
|
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="200" height="100"> <param name="movie" value="images/trans.swf"> <param name="quality" value="high"> <param name="wmode" value="transparent"> <embed src="images/trans.swf" quality="high" wmode="transparent" pluginspage="http://www.macromedia. com/go/getflashplayer" type="application/x-shockwave-flash" width="200" height="100"></embed> </object> |
Second Method
Open a the flash file in your Macromedia Flash and go to File > Publish Settings or press Ctrl+Shift+F12. You should see the following window. In this window go to HTML tab and select Transparent Windowless from Window Mode and press Publish.

Now your file is saved as a transparent swf.
Related Articles
- Validate a Check Box Using JavaScript
- Automatic Redirect using Javascript
- Multi Level Drop Down Category & Subcategory Hierarcheal Selection using JavaScript
- Display Current Date Automatically on your Website using JavaScript
- How to Create a Reload Button which will Reload the Webpage upon Clicking using JavaScript
- Automatically Redirect from one Webpage to Another Webpage using JavaScript
- How to Display a Webpage in the PopUp Window after Clicking from a Link using JavaScript
- Disable Right Clicking on Webpage, Images and Photos with JavaScript
