Using JavaScript with Static Publishing

SWFObject's static publishing approach is purely markup-based and doesn't require JavaScript. However, the SWFObject JavaScript file will provide you with some additional scripting tools you may find handy, including:

  • the ability to specify minimum Flash Player version required for your SWF
  • the ability to use Adobe's Express Install system (an auto-update mechanism for Flash Player)
  • the ability to use JavaScript to target the inner <object> using the swfobject.getobjectById() utility

Specifying required minimum version of Flash Player

As you know, each version of Flash Player implements new goodies; older versions of Flash Player may not support the latest-and-greatest feature you'd like to use. For example, Flash Player 8 doesn't support ActionScript 3 and Flash Player 10 has improved video handling.

If your SWF requires a specific version of Flash Player, you can use SWFObject to ensure that your SWF will only embed when the visitor has a correct version of Flash Player available. If the visitor has an outdated version of Flash Player, you can use Express Install to prompt them to upgrade (see below). If they choose not to upgrade, or if they don't have Flash Player installed, they will see the fallback content. (Instructions for specifying a minimum version of Flash Player when using SWFObject's static publishing are included at the bottom of this article.)

Adobe's Express Install

Adobe Flash Player's Express Install feature allows you to prompt the user to upgrade their version of Flash Player. For instance, if your SWF requires Flash Player 10 and the visitor has Flash Player 8, you can use Express Install to prompt them to update to the latest version of Flash Player.

If they agree, they simply follow Adobe's on-screen instructions to upgrade. Visit Adobe's website for more detailed information. (Instructions for implementing Express Install via SWFObject's static publishing are included at the bottom of this article.)

swfobject.getobjectById()

SWFObject's static publishing technique uses nested <object> elements. Why use a nested <object> element? The simple explanation is that the outer <object> targets all versions of Internet Explorer while the inner <object> works in all browsers not named Internet Explorer.

Sometimes if you're using JavaScript to modify your webpage, you may need to access this inner <object> with JavaScript. Since the inner <object> doesn't have an id (only the outer <object> has an id), you can't use document.getElementById() to access the <object>. This is where swfobject.getObjectById() comes in; it was designed to behave exactly as document.getElementById(). Simply replace document.getElementById() with swfobject.getObjectById() in your JavaScript and you should be good to go!

Implementing JavaScript with SWFObject's static publishing

Using the features described above is very simple with SWFObject — just add a link to the SWFObject JavaScript file, then add a single line of JavaScript to the <head> of your HTML document:

swfobject.registerObject("flashcontent", "9", "path/to/expressinstall.swf");

SWFObject's registerObject function takes four arguments:

  1. ID (required): The ID of your SWF, as specified by "id=" in your outer <object> element. In our example, the ID is "flashcontent".
  2. Required minimum version of Flash Player (required): The minimum version of Flash Player you would like your visitors to have in order to view your SWF. In our example, we specify Flash Player 9 ("9"). You can target a specific release of a major version, such as "9.0.0", but for our example we just look for the major version ("9").
    Note: The number is passed as a string.
  3. Express Install SWF location (optional): The path to your Express Install SWF (this SWF is included in the SWFObject ZIP package). This SWF contains code that triggers Adobe's Express Install updater if the required version of Flash Player is not found.
    Note: Express Install is only supported by Flash Player 6.0.65 and higher in both Windows and OS X, and requires a minimal SWF size of 310 x 137 pixels.
  4. Callback function (optional): SWFObject allows you to invoke a callback function when embedding has succeeded or failed.
    Note: if you intend to include a callback function but you don't want to use Express Install, you can simple pass a boolean false where the path to the Express Install SWF is required:

  5. Callback function (optional): SWFObject allows you to invoke a callback function when embedding has succeeded or failed.
    Note: if you intend to include a callback function but you don't want to use Express Install, you can simple pass a boolean false where the path to the Express Install SWF is required:

    function myCallbackFunction() {
      //do something
    }
    swfobject.registerObject("flashcontent", "9", false, myCallbackFunction);

Demo: static publishing with registerObject

Questions or Comments?

If you have questions or would like to point out an error, please post your remarks in the SWFObject Google Group. Thanks!