Flash 5 HTML Code

Even though Flash animation are not created in HTML, they need to have some HTML code to display the animations in a Web browser. The scroll box below contains the HTML code that Flash outputs for publishing animations.

The simplest method of displaying Flash animation in a browser is to use Macromedia's HTML file that gets generated during Publishing. It not only includes the HTML code, the code is also custom tailored to your animation. The following code is primarily for SWF programs such as Swish and Swift3D that do not export a HTML file along with an animation.

The code:

Copy the code and paste it into your HTML document. It will look cryptic to you, especially if you are not familiar with HTML. The following will help you customize the code to your movie:

Setting the movie:

To set the animation in your code, change movie.swf to the name of your movie clip. You will have to change it twice. If you look at the code, you will see that movie.swf appears after the <PARAM NAME tag and in the <EMBED src="movie.swf"  tags.

Setting the dimensions:

Now that you have the movie set up, it is time to adjust the width and height of the animation. The simplest way to change the width and the height is to find the words WIDTH= and HEIGHT= and enter the appropriate values. There are two WIDTH tags and two HEIGHT tags. Make sure you change them both or the animation will not display properly on certain browsers.

The following is an example of how one of my animations looks like after being published using the HTML file. I highlighted the tags that I modified to display the animation:

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/
WIDTH=550 HEIGHT=400>

<PARAM NAME=movie VALUE="kp.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#666666>

<EMBED src="kp.swf" quality=high bgcolor=#666666 WIDTH=550 HEIGHT=400
TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?>
</EMBED>

[ The code has been modified to fit in the browser. DO NOT COPY THE CODE PASTED ABOVE. Copy the code found near the top of the page in the menu box instead. ]

Just a final word before we wrap up. If you have a question and/or want to be part of a friendly, collaborative community of over 220k other developers like yourself, post on the forums for a quick response!

Kirupa's signature!

 




SUPPORTERS:

kirupa.com's fast and reliable hosting provided by Media Temple.