Lab: SWFObject

SWFObject 2.x: Plain-vanilla embedding

SWFObject 2.x provides two different approaches to embedding a SWF: static publishing, which means the markup is added to the page manually, and dynamic publishing, which uses JavaScript to add the markup for you when your page loads in the browser.

Static publishing requires adding two <object> elements as follows:

<object id="flashcontent" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%">
  <param name="movie" value="mymovie.swf" />
  <!--[if !IE]>-->
  <object type="application/x-shockwave-flash" data="mymovie.swf" width="100%" height="100%">
  <!--<![endif]-->
    <p>
      Fallback or 'alternate' content goes here.
      This content will only be visible if the SWF fails to load.
    </p>
  <!--[if !IE]>-->
  </object>
  <!--<![endif]-->
</object>

SWFObject's static publishing method also provides the option to 'register' the SWF with SWFObject. This enables additional functionality, including swfobject.getObjectById (a workaround for dealing with the nested objects) and Flash's ExpressInstall feature. Read more about registering SWFs in the SWFObject wiki. To register a SWF, simply add the following code to the <head> of your document:

<script type="text/javascript">
   swfobject.registerObject("flashcontent", "7", "/lab/_common/expressinstall.swf");   
</script>

Dynamic publishing requires adding one line of JavaScript, and a 'target' element in your markup (usually a <div>, but a <p> or any other block-level element should work).

<script type="text/javascript">
swfobject.embedSWF("mymovie.swf", "flashcontent", "100%", "100%", "7");
</script>
<body>
   <div id="flashcontent">
      Fallback or 'alternate' content goes here.
      This content will be replaced by the SWF
      after SWFObject embeds it.
   </div>
</body>

Working examples: static publishing | dynamic publishing (tested in Firefox 2, IE 6, and Safari 3.1 Windows).

Read more about SWFObject (and advanced options) at the official SWFObject documentation page: http://code.google.com/p/swfobject/wiki/documentation