Embedding images, SWF files, and movie clips in text fields

In Flash Player 7 and later, you can use the <img> tag to embed JPEG files, SWF files, and movie clips inside dynamic and input text fields. (For a full list of attributes for the <img> tag, see Image tag (<img>).)

By default, Flash displays media embedded in a text field at full size. To specify dimensions for embedded media, use the <img> tags's height and width attributes. (See Specifying height and width values.)

In general, an image embedded in a text field appears on the line following the <img> tag. However, when the <img> tag is the first character in the text field, the image appears on the first line of the text field.

Embedding SWF and JPEG files

To embed a JPEG or SWF file in a text field, specify the absolute or relative path to the JPEG or SWF file in the <img> tag's src attribute. For example, the following code inserts a JPEG file that's located in the same directory as the SWF file.

textField_txt.htmlText = "<p>Here's a picture from my last vacation:<img src='beach.jpg'>";

Embedding movie clip symbols

To embed a movie clip symbol in a text field, you specify the symbol's linkage identifier for the <img> tag's src attribute. (For information on defining a linkage identifier, see Attaching a movie clip symbol to the Stage.)

For example, the following code inserts a movie clip symbol with the linkage identifier symbol_ID.

textField_txt.htmlText = "<p>Here's a movie clip symbol:<img src='symbol_ID'>";

In order for an embedded movie clip to display properly and completely, the registration point for its symbol should be at point (0,0).

Specifying height and width values

If you specify width and height attributes for an <img> tag, space is reserved in the text field for the JPEG file, SWF file, or movie clip. After a JPEG or SWF file has downloaded completely it is displayed in the reserved space. Flash scales the media up or down according to the height and width values.

If you don't specify height and width values, no space is reserved for the embedded media. After a JPEG or SWF file has downloaded completely, Flash inserts it into the text field at full size and rebreaks text around it.

Controlling embedded media with ActionScript

Flash Player creates a new movie clip for each <img> tag and embeds that movie clip within the TextField object. The <img> tag's id attribute lets you assign an instance name to the movie clip that is created. This lets you control that movie clip with ActionScript.

The movie clip created by Flash Player is added as a child movie clip to the text field that contains the image.

For example, the following code embeds a SWF file named animation.swf in the text field named textField_txt on level 0 and assigns the instance name animation_mc to the movie clip that contains the SWF file.

_level0.textField_txt.htmlText = "Here's an interesting animation: <img src='animation.swf' id='animation_mc'>

In this case, the fully qualified path to the newly create movie clip is _level0.textField_txt.animation_mc. For example, you could attach the following code to a button (on the same Timeline as textField_txt) that would stop the playhead of the embedded SWF file.

on(press) {
  textField_txt.animation_mc.stop();
}

Making hyperlinks out of embedded media

To make a hyperlink out of an embedded JPEG file, SWF file, or movie clip, enclose the <img> tag in an <a> tag:

textField.htmlText = "Click the image to return home<a href='home.htm'><img src='home.jpg'></a>";

When the mouse is over an image, SWF file, or movie clip that is enclosed by <a> tags, the mouse pointer turns into a "hand" icon, just like standard hyperlinks. Interactivity, such as mouse clicks and keypresses, do not register in SWF files and movie clips that are enclosed by <a> tags.