User Guide
Formatting text with Cascading Style Sheets 229
7.
Add the following code to the Actions panel:
var styles = new TextField.StyleSheet();
styles.load("styles.css");
styles.onLoad = function(ok) {
if (ok) {
// display style names
trace(this.getStyleNames());
} else {
trace("Error loading CSS file.");
}
};
Note: In the previous code snippet, this in this.getStyleNames() refers to the styles object
you constructed in the first line of ActionScript.
8.
Save the FLA file to the same directory that contains styles.css.
9.
Test the movie (Control > Test Movie).
You should see the names of the two styles in the Output panel:
.bodyText,.headline
If you see “Error loading CSS file.” in the Output panel, make sure the FLA file and the CSS
file are in the same directory and that you typed the name of the CSS file correctly.
As with all other ActionScript methods that load data over the network, the CSS file must reside
in the same domain as the SWF file that is loading the file. (See “Cross-domain and subdomain
access between SWF files” on page 15.) For more information on using CSS with Flash, see
“TextField.StyleSheet class” in Flash ActionScript Language Reference.
Creating new styles with ActionScript
You can create new text styles with ActionScript using the
setStyle() method of the
TextField.StyleSheet class. This method takes two parameters: the name of the style and an object
that defines that style’s properties.
For example, the following code creates a style sheet object named
styles that defines two styles
that are identical to the ones you already imported (see “Loading external CSS files”
on page 228):
var styles = new TextField.StyleSheet();
styles.setStyle("bodyText",
{fontFamily: 'Arial,Helvetica,sans-serif',
fontSize: '12px'}
);
styles.setStyle("headline",
{fontFamily: 'Arial,Helvetica,sans-serif',
fontSize: '24px'}
);