YUI Library Home

Site Search (YDN & YUIBlog):

# YUI Library Examples: SWF Utility: Simple SWF Utility Example

# SWF Utility: Simple SWF Utility Example

This is a simple example of the YUI SWF Utility's features.

Note: This example of the YUI SWF Utility usage requires Flash Player 9.0.115 or higher. The latest version of Flash Player is available at the Adobe Flash Player Download Center.

View example in new window.

The version of the Flash player installed on your computer is outdated. Please download and install the newest version.

## Simple SWF Utility Example

In this example, we demonstrate how to embed a SWF on a page and pass it some configuration parameters.

First, include the following JS source files:

<!-- Dependencies --> <script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/element/element-min.js"></script> <!-- Source files --> <script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/swf/swf-min.js"></script>

Next, create a container where the SWF will be placed. The size of the container will be the size of the SWF (in this case, we set it to 400 by 200 pixels). The current (HTML) content of the container is what will be displayed if there is no Flash installed on the user's machine, or if the version of the Flash player installed does not match the minimum required.

<div id="swfContainer" style="width:400px;height:200px"> The version of the Flash player installed on your computer is outdated. Please download and install the latest version. </div>

Now, create an object with the necessary parameters to pass to the SWF. In this case, we specify the minimum version of Flash player required, whether to use the ExpressInstall capability of the Flash player, and a few SWF-specific fixed attributes, namely the `scale` attribute (which specifies whether to shrink or stretch the Flash content to fit the viewport; in this case, no shrinking or stretching is allowed), and the `salign` attribute (which specifies how to align the content in the viewport; in this case, we align it to top left):

var params = {version: 9.115, useExpressInstall: false, fixedAttributes: {scale: "noscale", salign: "TL"} };

Finally, create an instance of the SWF, passing the name of the container in which to embed it, the URL of the SWF, and the parameter object created above:

var newswf = new YAHOO.widget.SWF("swfContainer", "assets/SWFExampleSimple.swf", params);

## Configuration for This Example

You can load the necessary JavaScript and CSS for this example from Yahoo's servers. Click here to load the YUI Dependency Configurator with all of this example's dependencies preconfigured.

### YUI Logger Output:

### SWF Utility Examples:

- Simple SWF Utility Example
- Advanced SWF Utility Example With Flashvars and Javascript interaction

### More SWF Utility Resources:

- User's Guide (external)
- API Documentation
- Cheat Sheet PDF (external)

Copyright © 2009 Yahoo! Inc. All rights reserved.

Privacy Policy - Terms of Service - Copyright Policy - Job Openings