Using SWFObject to Seamlessly Upgrade to Flash Player 10

Greg Jastrab -

If you haven't heard that Flash Player 10 was officially released, then get out of the hole you've been living in and go get Flash Player 10!

When you're ready to deploy your first Flash Player 10 SWF, you'll want to ensure your users have the latest Flash Player so they can actually view your content! Why not make it as easy as possible for them to upgrade and use SWFObject to embed your SWF and seamlessly upgrade older version of the Flash Player up to 10?

Let's say you're embedding a SWF called MyFlashPlayer10.swf. Using the dynamic publishing method there are just 3 simple steps to follow to get your SWF embedded with SWFObject...

1. Include the SWFObject JavaScript Library on Your Page

Assuming you've downloaded SWFObject onto your server and placed swfobject.js in the same directory as the HTML page you're editing:

<head>
  <script type="text/javascript" src="swfobject.js"></script>
</head>

2. Add a DIV to Hold the SWF

Place a

tag on the page where you want the SWF to be embedded, giving it an ID:

<body>
...
<div id="swf">
You need <a href="http://www.adobe.com/go/getflash">Flash Player</a> to see this content!
</div>

The content inside of the DIV will be replaced with your SWF if Flash is present on the user's machine.

3. Tell SWFObject to Embed the SWF

Add the JavaScript code to embed the SWF after the tag you've added in step 1:

<script type="text/javascript">
<!--
swfobject.addDomLoadEvent(function() {
  swfobject.embedSWF("MyFlashPlayer10.swf", "swf",
                     "300", "300",
                     "10.0.12", "expressInstall.swf");
});
//-->
</script>

Refer to the SWFObject documentation for the details of these parameters, but a quick explanation:

The addDomLoadEvent function ensures that the DOM is available before running a function.

The parameters for embedSWF are:

  1. URL to SWF
  2. ID of DIV to place SWF in
  3. width of SWF
  4. height of SWF
  5. minimum required Flash Player version
  6. URL to express install SWF

There are some other optional parameters, but I won't go into those here. The important parameters to focus on for seamlessly upgrading are the 5th and 6th parameters.

10.0.12 means that we want at least Flash Player 10.0.12 to be installed. You can also just specify 10.0.0 for a minimum of Flash Player 10.

The expressInstall SWF is included in the SWFObject download, and will provide the functionality of prompting the user to seamlessly upgrade their Flash Player. If the user confirms the prompt it presents the Flash Player installer will launch, and the user will be prompted to close the browser so the installation may proceed. Once it completes, Flash Player 10 (or whatever version has been required) will be installed on the machine!

If you have more questions on SWFObject check out the SWFObject Google Group.