How to Fix Overlapping Movie Clips - Flash CS4 (AS3)

The first example below is flawed. The second example works correctly.

You need to upgrade your Flash player (v.9 or later) to view this tutorial.

When we create movie clips in Flash, it's easy enough to get one movie clip behaving nicely all alone. It can be another matter to get several movie clips to work properly -- because of their interactions. In the example ABOVE, you'll see that the third movie clip works perfectly, but the first and second do not.

This problem is solved in the example BELOW.

You need to upgrade your Flash player (v.9 or later) to view this tutorial.

In the working example, one line of ActionScript was added to the function called by the big blue button:

parent.setChildIndex(this, parent.numChildren - 1);

The "index" referred to determines which object is topmost among all the objects. This line of script, embedded in EACH one of the three movie clips in our example, dynamically changes the index (or depth) of the object selected to make it go "on top." (In earlier versions of ActionScript, this trick was called "swap depths.")

To view the tiny bit of ActionScript that makes this possible, download the FLA files.

DOWNLOAD You'll find both of the FLAs in this folder.

Education use: This package was created as an example for my journalism students. It is not intended to be used commercially.

Use and re-use: Fix Overlapping Movie Clips - Flash CS4 (AS3) by Mindy McAdams is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License.
Creative Commons License

Updated 19 April 2010