Saturday, May 29, 2010

How to Make Transparent Background of SWF in Webpage

When you insert SWF file in your webpage it always show given background color and if you want transparent background color and want to use your webpage bg color then you have to need make transparent background of swf file. This is the very simple way but for this you will have to use only stage background color in flash not any rectangle on stage because this method only transparent stage bg color.



First Step:


Make flash file and use only bg color of stage. Don't use any recangle there for background color.


Method 1: Using Flash


The HTML for a Flash movie can be created using the Publish Settings feature in Flash. The Publish Settings dialog box provides an option to affect the WMODE setting. The options selected in the Publish Settings will be added to the HTML source code automatically:


Step 1:


Choose File > Publish Settings. Select the HTML tab. or press Shift + F12.



Step 2:



Choose "Transparent" in the WMODE setting to make the Flash movie's background disappear in browsers which support this feature.



Step 3:



Publish the document.


You will find this "wmode=transparent" code in html file which make swf file transparent.


Method 2: Editing HTML code manually for Wmode


To edit an existing HTML page, add the WMODE parameters to the HTML code.


Add the following parameter to the OBJECT tag:


<param name="wmode" value="transparent">

Add the following parameter to the EMBED tag:


wmode=transparent

Method 2: Using Dreamweaver


Follow the below steps, and Dreamweaver will insert the correct HTML code automatically.



Step 1:



In Dreamweaver, insert the Flash movie into an HTML page.



Step 2:



Select the Flash movie in the Design View.



Step 3:



In the Properties panel, choose Parameters.


swf transparent How to Make SWF Background Transparent in Webpage



Step 4:



For the Parameter, enter "wmode" (without quotes). For the Value, enter "transparent".


or


In property panel choose wmode dropdown.


swf transparent How to Make SWF Background Transparent in Webpage



Step 5:



Save the document. The HTML page is complete.

16 comments:

  1. Good dispatch and this fill someone in on helped me alot in my college assignement. Thank you for your information.

    ReplyDelete
  2. helpful tutorial....

    ReplyDelete
  3. Thank you SOO MUCH, so easy !! thanks

    ReplyDelete
  4. Real helpful tips..
    Thanks... a lot..

    ReplyDelete
  5. Excellent tutorial...Helpful to solve the problem..

    ReplyDelete
  6. Very good write-up! I will be also gonna write a blog article about it... thanks

    ReplyDelete
  7. nice tutorial thanks for sharing it

    ReplyDelete
  8. excellent tutorials...easy to learn

    ReplyDelete
  9. nice tutorials thanks for sharing it

    ReplyDelete
  10. What a fine tutorial, very easy to understand and follow. Thanks and good luck.

    ReplyDelete