Downloading SWFObject 2 and SWFObject Generator

You can find the latest version of SWFObject and its documentation on Google Code. Inside the sample download you'll find swfobject_2_1.zip, which contains the following files:

• expressInstall.swf: Contains the default functionality of SWFObject for Adobe Express Install
• swfobject.js: Contains the minified SWFObject 2 JavaScript library that should be used in production
• index.html, index_dynamic.html, and test.swf: Included as a reference test implementation
• src folder: Contains swfobject.js (unminified and fully documented SWFObject 2 JavaScript file) and expressInstall.fla and expressInstall.as (source files of the expressInstall.swf file). These are provided solely so developers can study SWFObject's source code or create a customized version to fit their own needs.

Because having to figure out which markup and JavaScript code to use can be a tedious job, the project provides a publishing tool—as an additional download—called SWFObject Generator to do this work for you. There are two versions available: a simple HTML page and an Adobe AIR 1.0 desktop application. The main difference is that the AIR version can also use copy-to-Clipboard functionality or save your HTML page onto your hard drive. For this tutorial you will use the AIR application.

Note: All downloads are also available in the downloads folder of swfobject_examples.zip.

Embedding SWF content

Extract the swfobject_examples.zip file and open the example_1 folder. It contains the SWFObject 2 JavaScript library, expressInstall.swf, and a test SWF file named test.swf that is 300×120 pixels.

Using static publishing

Extract the swfobject_generator_1_1_air.zip file (make sure you have Adobe AIR 1.0 or later installed). Note that the publishing method is static by default. Open SWFObject Generator (see Figure 1) and change the following default parameters:

• test.swf for Flash (.swf)
• 300x120 for the dimensions

Figure 1. Configuring the dimensions of the SWF file to be embedded

Click the Save File button, name your HTML file index_static.html, and save it in the example_1 directory. If you open the newly saved index_static.html file in your web browser (make sure you have the latest version of Adobe Flash Player installed), you should see the test SWF file indicating your operating system and Flash Player version (see Figure 2)

Figure 2. Test SWF file indicating your operating system and Flash Player version

Congratulations! You have just embedded your first SWF file using SWFObject 2 static publishing! Easy enough, wasn't it?

Using dynamic publishing

Open SWFObject Generator and change the same parameters as before, only now just select Dynamic publishing for the publishing method. Next, click the Save File button, name your HTML file index_dynamic.html, and save it in the example_1 directory. If you open index_dynamic.html file in your web browser, you should again see the test SWF file indicating your operating system and Flash Player version. As you can see, switching publishing modes is as easy as changing a value in one pop-up menu!

Page 2 of 6

Previous Page

Next Page