Tutorial Details:
Written by:
Ahmet Zorlu (drZoode)
Time: 20 minutes
Difficulty Level: Intermediate
Requirements: Flash 5 or higher
Topics Coverred: How to change the background color of an html page from an embedded Flash movie (using getURL or FSCommands).
Assumed Knowledge: Basic knowledge of getURL and FSCommand actions, basic knowledge of JavaScript.

See the examples:
Technique 1
Technique 2 Download the source.

First Technique: Using the getURL action


Flash movies can interact with Web browser scripting environments (JavaScript in Netscape and JavaScript, VBScript, and JScript in Internet Explorer). We can control our Flash movie from a script and we can call a script from our .swf file. In the first case we use Flash methods (JavaScript functions specific to Flash movies) and if we want to send messages from a Flash movie to its host environment (in our case, a Web browser), we can use the getURL action or the FSCommand action.
In this tutorial we will learn how to create simple Flash buttons that can change the background color of the HTML page in which our Flash movie resides. In the first technique, we will add a short JavaScript code in the HEAD section of the HTML file and we will call the JavaScript function from the Flash movie by using the getURL action and a pseudo-URL as "JavaScript:".
Before going further you have to know that Flash Scripting requires Netscape Navigator 3.x and above (LiveConnect and Java-enabled; Windows 95/98/NT/2000 or MacOS; ) or Internet Explorer 3.x and above (ActiveX enabled; Windows 95/98/NT/2000 only). Netscape 6 does not support LiveConnect, that's why Flash scripting in Netscape 6 is currently very buggy.
But "JavaScript:" in getURL technique doesn't require LiveConnect plug-in, and it works in Netscape 6. Also this technique does not require Active-X, and it works in IE 5 on Mac.

Step 1 The JavaScript

As it is said in the ActionScript Reference of Flash 5, contrary to JavaScript, ActionScript does not support browser specific objects such as "document" or "window". That means you can not use browser specific objects in Flash. But we have a solution, we can use the getURL action to call a JavaScript function residing in the HTML page and we can control browser specific objects. So first of all let's write the JavaScript code.

<script language="JavaScript">
//The function is quite simple, it takes one argument, "newBgColor"
//and passes it as the value of the "bgColor" property of the "document" object
function changeBgColor(newBgColor) {
 if (window.document && window.document.bgColor) {
  document.bgColor = newBgColor;

As it is supposed to be a Flash tutorial I will not get into details with the JavaScript part. This script works with IE 4.0 and above, Netscape 4.0 and above and also DOM compliant browsers like IE 5.5 and Netscape 6.0.The "document.bgColor" property defines a document's background color (in our example the background color of our HTML page). The argument is a string that can contain either the hexadecimal definition of the color (like "#cccccc") or its literal description (like "lime").

Step 2 The ActionScript
In ActionScript, getURL action communicate with JavaScript (and server side scripts) and returns any information to the browser window.When using the getURL action you can refer to a JavaScript by using this general syntax:


This protocol works like usual calls to JavaScript in the HREF of an anchor tag (<A realsrc="JavaScript:yourFunction()" href="http://www.actionscript.org/dev/admin/JavaScript:yourFunction()">).
Now we will call this JavaScript function by using the getURL action. I assign this action to buttons but you can assign it to frames etc.In the movie, place 5 instances of a button symbol. For five different background color option I have created 5 buttons with different colors.
Then choose the first button instance and open the ActionScript window. In the normal mode choose the getURL action and paste this code in the URL box:


So your ActionScript window should look like this:

on (press) {
        getURL ("JavaScript:changeBgColor('#336600')");

You don't have to bother with the other select boxes.In our example we have called the "changeBgColor" JavaScript function and we have passed an argument ('#336600'). When the user will press the button, the background color of the web page will take the '#336600' value.Use the same technique with other buttons, just change the hex values (your arguments), in our example I have used these hex values: '#666699', '#ff6600', '#0066ff' and '#cccccc".