The HTML templates included with Flex Builder and Flex SDK use the <object> and <embed> tags embed your Flex application. In the case of Flex Builder, when you compile a project, Flex Builder sets the values for these tags for you. For the SDK, you must manually edit the templates and set the values of these tags.
The <object> and <embed> tags support a set of properties that add additional functionality to the wrapper. These properties let you change the appearance of the SWF file on the page or change some of its properties such as the title or language. If you want to customize your wrapper, you can add these properties to the wrapper.
The <object> tag is used by Internet Explorer 3.0 or later on Windows platforms or any browser that supports the use of the Flash ActiveX control. The <embed> tag is used by Netscape Navigator 2.0 or later, or browsers that support the use of the Netscape-compatible plug-in version of Flash Player.
When an ActiveX-enabled browser loads the HTML page, it reads the values set on the <object> and ignores the <embed> tag. When browsers using the Flash plug-in load the HTML page, they read the values set on the <embed> tag and ignore the <object> tag. Make sure that the properties for each tag are identical, unless you want different results depending on the user's browser.
You must set the values of four required properties as attributes in the <object> tag. The required properties are:
All other properties are optional and you set their values in separate, named <param> tags.
Although the movie property is technically an optional tag, without it, there is no reference to the application you want the client to load. Therefore, your wrapper should always set the movie parameter in the <object> tag.
The following example shows the required properties as attributes of the <object> tag, and four optional properties, movie, play, loop, and quality, as <param> child tags:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100" height="100" codebase="http://active.macromedia.com/flash7/cabs/ swflash.cab#version=9,0,0,0">
<param name="movie" value="moviename.swf">
<param name="play" value="true">
<param name="loop" value="true">
<param name="quality" value="high">
</object>
For the <embed> tag, all settings are attributes that appear between the angle brackets of the opening <embed> tag. The <embed> tag requires the height and width attributes, and the pluginspage attribute, which is the equivalent of the <object> tag's codebase property. The <embed> tag does not require a classid attribute. As with the movie parameter of the <object> tag, the src attribute of the <embed> tag provides the reference to the Flex application. Without it, there would be no SWF file, so you should consider it a required attribute.
Although the codebase and pluginspage properties are required, they are not necessarily used if you use Flash Player Detection Kit to detect and install the required version of Flash Player. For more information, see Using Express Install.The following example shows a simple <embed> tag with the optional quality attribute:
<embed src="moviename.swf" width="100" height="100" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"> </embed>
To use both tags together, position the <embed> tag just before the closing </object> tag, as the following example shows:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100" height="100" codebase="http://active.macromedia.com/flash7/cabs/ swflash.cab#version=9,0,0,0">
<param name="movie" value="moviename.swf">
<param name="play" value="true">
<param name="loop" value="true">
<param name="quality" value="high">
<embed src="moviename.swf" width="100" height="100" play="true" loop="true" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash">
</embed>
</object>
When you define parameters for the <object> tag, also add them as tag properties to the <embed> tag so that the SWF file appears the same on the page regardless of the client's browser.
If you are editing the HTML wrapper templates for the SDK, you will need to replace the tokens such as ${height} and ${width} in the <object> and <embed> tags with absolute values before deploying the wrapper. For more information, see About the HTML templates.
Not all properties are supported by both the <object> and the <embed> tags. For example, the id property is used only by the <object> tag, just as the name property is used only by the <embed> tag.
In some cases, the <object> and <embed> tag properties duplicate properties that you can set on the <mx:Application> tag in the Flex application source code. For example, you can set the height and width properties of the SWF file on the <object> and <embed> tags or you can set them on the <mx:Application> tag.
The following table describes the supported <object> and <embed> tag properties:
|
Property |
Type |
Description |
|---|---|---|
| align |
String |
Specifies the position of the SWF file. The align property supports the following values:
|
| allowNetworking |
String |
Restricts browser communication. This property affects more APIs than the allowScriptAccess property. The allowNetworking property supports the following values:
For more information, see Programming ActionScript 3.0. |
| allowScriptAccess |
String |
Controls the ability to perform outbound scripting from within the SWF file. The allowScriptAccess property can prevent a SWF file hosted from one domain from accessing a script in an HTML page that comes from another domain. Setting allowScriptAccess to never for all SWF files hosted from another domain can ensure security of scripts located in an HTML page. Valid values are as follows:
The default value for the web-tier compiler is sameDomain. This property affects the following operations:
For more information, see Programming ActionScript 3.0. |
| archive |
String |
Specifies a space-separated list of URIs for archives containing resources used by the application, which may include the resources specified by the classid and data properties. Preloading archives can result in reduced load times for applications. Archives specified as relative URIs are interpreted relative to the codebase property. |
| base |
String |
Specifies the base directory or URL used to resolve relative path statements in ActionScript. |
| bgcolor |
String |
Specifies the background color of the application. Use this property to override the background color setting specified in the SWF file. This property does not affect the background color of the HTML page. Valid formats for bgcolor are any #RRGGBB, hexadecimal, or RGB value. The Application container's style uses an image as the default background image. This image obscures any background color settings that you might make in the wrapper. So, to make the value of the bgcolor property display properly, you must clear the Application container's backgroundImage style property. To do this, you can set it to the value of a space character, as the following example shows: <mx:Style> Application { backgroundImage: " "; } </mx:Style> |
| border |
int |
Specifies the width of the SWF file's border, in pixels. The default value for this property depends on the user agent. |
| classid |
String |
Defines the classid of Flash Player. This identifies the ActiveX control for the browser. Internet Explorer 3.0 or later on Windows 9x, Windows 2000, Windows NT, Windows ME, and Windows XP prompt the user with a dialog box asking if they would like to auto-install Flash Player if it's not already installed. This process can occur without the user having to restart the browser. This property is used for the <object> tag only. For the <object> tag, you set the value of this property as an attribute of the <object> tag and not as a <param> tag. |
| codebase |
String |
Identifies the location of Flash Player ActiveX control so that the browser can download it if it is not already installed. This property is used for the <object> tag only. You can modify this property by using the settings in Flex Builder. For the <object> tag, you set the value of this property as an attribute of the tag and not as a child <param> tag. Like the pluginspage property, the codebase property is required. However, they are not necessarily used if you use Flash Player Detection Kit to detect and install the required version of Flash Player. For more information, see Using Express Install. |
| codetype |
String |
Defines the content type of data expected when downloading the application specified by the classid property The codetype property is optional but recommended when the classid property is specified; it lets the browser avoid loading unsupported content types. The default value of the codetype property is the value of the type property. |
| data |
String |
Specifies the location of the application's data; for example, instance image data for objects that define images. If the data property is a relative URI, it is relative to the codebase property. |
| declare |
Boolean |
Makes the current SWF file's definition a declaration only. The SWF file must be instantiated by a subsequent object definition referring to this declaration. |
| devicefont |
Boolean |
Specifies whether static text objects for which the deviceFont option is not selected are drawn using a device font anyway, if the needed fonts are available from the operating system. |
| dir |
String |
Specifies the base direction of text in an element's content and attribute values. It also specifies the directionality of tables. Valid values are LTR (left-to-right text or table) and RTL (right-to-left text or table). |
| flashVars |
String |
Sends variables to the application. The format is a set of name-value pairs, each separated by an ampersand (&). Browsers support string sizes of up to 64 KB (65535 bytes) in length. The default value of this property is typically an empty string. For more information on using flashVars to pass variables to Flex applications, see Communicating with the Wrapper. |
| height |
int |
Defines the height, in pixels, of the SWF file. Flash Player makes a best guess to determine the height of the application if none is provided. The browser scales an object or image to match the height and width specified by the author. You can set this value to a fixed number or a percentage value; for example, length='100' or length='50%'. Lengths expressed as percentages are based on the horizontal or vertical space currently available, not on the default size of the SWF file. FireFox browsers do not support percentage-based values. You can also set the height of a Flex application by setting the height property of the <mx:Application> tag in an MXML file. For the <object> tag, you set the value of this property as an attribute of the <object> tag and not as a <param> child tag. |
| hspace |
int |
Specifies the amount of white space inserted to the left and right of the SWF file. The default value is typically not specified, but is generally a small, nonzero length. |
| id |
String |
Identifies the SWF file to the host environment (a web browser, for example) so that it can be referenced by using a scripting language such as VBScript or JavaScript. The id property is only used with the <object> tag. It is equivalent to the name property used with the <embed> tag. |
| lang |
String |
Specifies the base language of an element's property values and text content. The default value is typically unknown. The browser can use language information specified using the lang property to control rendering in a variety of ways. |
| menu |
Boolean |
Changes the appearance of the menu that appears when users right-click over a Flex application in Flash Player. Set to true to display the entire menu. Set to false to display only the About and Settings options on the menu. The default value is typically true. |
| movie |
String |
Specifies the location of the SWF file. The movie property is only used with the <embed> tag. It is equivalent to the src property used with the <object> tag. |
| name |
String |
Identifies the SWF file to the host environment (a web browser, typically) so that it can be referenced by using a scripting language. The name property is only used with the <embed> tag. It is equivalent to the id property used with the <object> tag. |
| pluginspage |
String |
Identifies the location of Flash Player plug-in so that the user can download it if it is not already installed. This property is used for the <embed> tag only. You can modify this property by using the settings in Flex Builder. Like the codebase property, the pluginspage property is required. However, these properties are not necessarily used if you use Flash Player Detection Kit to detect and install the required version of Flash Player. For more information, see Using Express Install. |
| quality |
String |
Defines the quality of playback in Flash Player. Valid values of quality are low, medium, high, autolow, autohigh, and best. The default value is typically best. The low setting favors playback speed over appearance and never uses anti-aliasing. The autolow setting emphasizes speed at first but improves appearance whenever possible. Playback begins with anti-aliasing turned off. If Flash Player detects that the processor can handle it, anti-aliasing is turned on. The autohigh setting emphasizes playback speed and appearance equally at first, but sacrifices appearance for playback speed if necessary. Playback begins with anti-aliasing turned on. If the actual frame rate drops below the specified frame rate, anti-aliasing is turned off to improve playback speed. Use this setting to emulate the View > Antialias setting in Flash. The medium setting applies some anti-aliasing and does not smooth bitmaps. The high setting favors appearance over playback speed and always applies anti-aliasing. The best setting provides the best display quality and does not consider playback speed. All output is anti-aliased and all bitmaps are smoothed. |
| salign |
String |
Positions the SWF file within the browser. Valid values are L, T, R, B, TL, TR, BL, and BR. L, R, T, and B align the SWF file along the left, right, top, or bottom edge, respectively, of the browser window and crop the remaining three sides as needed. TL and TR align the SWF file to the top-left and top-right corner, respectively, of the browser window and crop the bottom and remaining right or left side as needed. BL and BR align the SWF file to the bottom-left and bottom-right corner, respectively, of the browser window and crop the top and remaining right or left side as needed. |
| scale |
String |
Defines how the browser fills the screen with the SWF file. The default value is typically showall. Valid values of the scale property are showall, noborder, and exactfit. Set to showall to make the entire SWF file visible in the specified area without distortion, while maintaining the original aspect ratio of the SWF file. Borders may appear on two sides of the SWF file. Set to noborder to scale the SWF file to fill the specified area, without distortion but possibly with some cropping, while maintaining the original aspect ratio of the SWF file. Set to exactfit to make the entire SWF file visible in the specified area without trying to preserve the original aspect ratio. Distortion may occur. |
| src |
String |
Specifies the location of the SWF file. The src property is only used with the <object> tag. It is equivalent to the movie property used with the <embed> tag. |
| standby |
String |
Defines a message that the browser displays while loading the object's implementation and data. |
| style |
String |
Specifies style information for the SWF file. The syntax of the value of the style property is determined by the default style sheet language. In CSS, property declarations have the form "name:value" and are separated by a semicolon. Styles set with this property do not affect components or the Application container in the Flex application. Rather, they apply to the SWF file as it appears on the HTML page. |
|
supportembed |
Boolean |
Determines whether the Netscape-specific <embed> tag is supported. The supportembed property is optional, and the default value is typically true. Set to false to prevent the <embed> tag from being read by the browser. |
|
tabindex |
int |
Specifies the position of the SWF file in the tabbing order for the current document. This value must be a number between 0 and 32767. User agents should ignore leading zeros. |
| title |
String |
Displays information about the SWF file. Values of the title property can be rendered by browsers or other user agents in different ways. For example, some browsers display the title as a ToolTip. Audio user agents might speak the title information in a similar context. |
| type |
String |
Specifies the content type for the data specified by the data property. The type property is optional but recommended when data is specified; it prevents the browser from loading unsupported content types. If the value of this property differs from the HTTP Content-Type returned by the server, the HTTP Content-Type takes precedence. |
| usemap |
String |
Associates an image map with the SWF file. The image map is defined by a map element. The value of usemap must match the value of the name attribute of the associated map element. |
|
vspace |
int |
Specifies the amount of white space inserted above and below the SWF file. The default value is typically not specified, but is generally a small, nonzero length. |
|
width |
int |
Defines the width, in pixels, of the SWF file. Flash Player makes a best guess to determine the width of the application if none is provided. Browsers scale an object or image to match the height and width specified by the author. You can set this value to a fixed number or a percentage value. For example, "width=100" or "width="50%". Lengths expressed as percentages are based on the horizontal or vertical space currently available, not on the natural size of the SWF file. You can also set the width of a Flex application by setting the width property of the <mx:Application> tag in an MXML file. For the <object> tag, you set the value of this property as an attribute of the <object> tag and not as a <param> tag. |
|
wmode |
String |
Sets the Window Mode property of the SWF file for transparency, layering, and positioning in the browser. Valid values of wmode are window, opaque, and transparent. Set to window to play the SWF in its own rectangular window on a web page. Set to opaque to hide everything on the page behind it. Set to transparent so that the background of the HTML page shows through all transparent portions of the SWF file. This can slow animation performance. To make sections of your SWF file transparent, you must set the alpha property to 0. To make your application's background transparent, set the backgroundAlpha property on the <mx:Application> tag to 0. The wmode property is not supported in all browsers and platforms. |
The <object> and <embed> tags can also take additional properties that are not supported by Flex applications. These unsupported properties are listed in Unsupported properties.