# AS3 movieclip depth management

**URL:** <https://forum.kirupa.com/t/as3-movieclip-depth-management/308524>\
**Category:** flash\
**Created:** [April 24, 2010, 11:19pm UTC](https://forum.kirupa.com/t/as3-movieclip-depth-management/308524 "2010-04-24T23:19:19Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![SiegeFilms](https://avatars.discourse-cdn.com/v4/letter/s/b5a626/32.png) [@SiegeFilms](https://forum.kirupa.com/u/SiegeFilms)\
**Post date:** [April 24, 2010, 11:19pm UTC](https://forum.kirupa.com/t/as3-movieclip-depth-management/308524/1 "2010-04-24T23:19:19Z")

</div>

Hi everyone. I started with some AS2 pageflip code that I’ve been modifying because I needed the code in AS3, and I wanted to make some changes to it. I’m new to actionscript so I’ll admit up front this was either ambitious or stupid.

At anyrate, I’m having a problem with the depth of two movieclips created. The code first creates a page using the makePage function, and then creates a shade for that page (makeShade function).

When running the code, the page appears on top of the shade. When using getChildIndex, the page’s index = 11, and the shade’s index = 14.

Why is the page appearing on top of the shade? Any ideas?

The complete code is super long so I’ve attached the code that has the shade and page below:

//create left-aligned page-sized solid fill  
function makePage(targ, xQuadrant) {  
//trace (“in make page”);  
targ = new MovieClip();  
addChild(targ);

with(targ.graphics) {  
beginFill(pageColor, 100);  
moveTo(0, 0);  
lineTo(0, pageH);  
lineTo(pageW, pageH);  
lineTo(pageW, 0);  
endFill();  
//trace (“end of make page function”);  
}

targ.visible = false;  
trace(“page targ depth=”, getChildIndex(targ));  
}  
//create left-aligned page-sized shadow  
function makeShade(targ, xQuadrant) {  
targ = new MovieClip();  
addChild(targ);  
with(targ.graphics){  
var gradType:String = GradientType.LINEAR;  
var matrix:Matrix = new Matrix();  
matrix.createGradientBox(pageW, pageH, deg2rad(0));  
var colors:Array =[0x000000, 0x000000, 0x000000];  
var alphas:Array =[.7, .5, 0];  
var ratios:Array =[0, 17, 255];  
beginGradientFill(gradType, colors, alphas, ratios, matrix);;  
moveTo(0, 0);  
lineTo(0, pageH);  
lineTo(pageW, pageH);  
lineTo(pageW, 0);  
endFill();  
trace (“end of make shade function”);  
trace(“shade targ depth=”, getChildIndex(targ));  
}  
}

//Place Stationary Pages  
var SLP:MovieClip;  
var SRP:MovieClip;  
var Shade:MovieClip;  
function setStationary() {  
//place left page

SLP = new MovieClip();  
trace (“clip created”);  
trace(flipPage);  
if (flipPage != 1.5) {

makePage(SLP, -1);  
//i = 2;  
//trace(pageclass);  
var slpPrint = new pages[1];  
SLP.addChild(slpPrint);  
//trace (slpPrint);  
with (SLP.slpPrint) {  
x = -pageW/2;  
y = -pivotY;  
}  
}

//right page

trace(maxPages);  
if (flipPage != maxPages -.5) {

trace(“flip page does not equal 7.5”);  
makePage(SRP, 1);

//var srpPrint=new pages[0];  
var srpPrint = new pages[0];  
addChild(srpPrint);

srpPrint.x = pageW/2;  
srpPrint.y = 0;

trace (“after makePage”);

}

//place shade on page not being revealed  
trace(“exit set stationary if statement”);  
var targ = dir\>0 ? SLP:SRP;  
Shade = new MovieClip();  
addChild(Shade);  
trace(“pre-makeShade”);  
makeShade(Shade, -dir);  
trace (“end of set stationary function”);  
}