Set Up Your Files

These are the folders you will need. You can save your

  1. Flash .fla and .swf files in the flash folder,
  2. he JavaScript you need will be in the js folder and the
  3. images and
  4. css go in their respective folders.
  5. HTML is just in the main containing folder.
Set Up Your Files

Ready Your Movie

Make sure your flash movie is ready with all of the Animations (1) , FPS (2) , Size (3) and content (4).

Open the Publish Settings

Open the Publish Settings

Publish Settings

Make sure you have:

  1. Flash checked
  2. At least one image format (jpeg, gif, png) you can choose more than one

We won't need the HTML wrapper. We will do that by hand.

When you're ready click the Publish button (3)

Publish Settings

Flash

If you have simple animations you may be able to choose an earlier version of the Flash Player. This will just have the effect of allowing people who havn't upgraded their plugin to the latest version to also see your Movie.

If you have a newer version of Flash installed (CS6 is shown) then the options might be different.

Whatever you choose. Write it down or remember it because you will need it later.

Flash

Published Files

You should now see the files you selected to publish in your flash folder

Published Files

Copy the Image(s)

Copy your images, We will paste them into the Images folder

Copy the Image(s)

Move to the Images Folder

Move to the Images Folder

Paste in the images.

Paste in the images.

js

js

Check that everything is setup.

Make sure you have all of the necessary files before completing the next step

  1. index.html
  2. .swf in the flash folder
  3. Image you will use in the Images folder
  4. swfobject.js in the js folder
Check that everything is setup.

Check that your HTML file is setup

You need to have a few things in place before you add the code needed to insert the Flash file.

  1. Make sure you have included the swfobject.js file. You can use that line exactly: <script type="text/javascript" src="js/swfobject.js"></script>
  2. Leave an open script element. We wil write in here in the next step.
  3. You need a div with an ID (not a class) that will be where the Flash content will go.
Check that your HTML file is setup

Add the code for the swf object

Paste in the swfobject code.
swfobject.embedSWF("flash/SiteTitle.swf", "headerFlash", "800", "200", "9.0.0");
YOu will need to modify the following to match your movie:

  1. The path to your swf file. Make sure to use the name you chose
  2. The id of the div you want the movie to appear in
  3. the width of the movie
  4. the height of the movie
  5. The version of the player it needs (from the previous step where you published the movie)

 

 

Publish Flash

That's it! Your movie should now appear when you open the HTML file in a browser (with Flash Player installed). Use Chrome in class.