Stacked images come to front if you hover over them

[asmithAPV]

I have an animate project with three rectangles that are movie clips. The three are stacked on top of one another but are offset so you could hover over each one. What I want is for the the rectangle I'm hovering over to come to the top. I created it using the setChildIndex  using createJS, but it isn't working. Please help!

var frequency = 15;
stage.enableMouseOver(frequency);
this.blueBox.addEventListener("mouseover", mouse1.bind(this));

function mouse1()
{
this.setChildIndex(this.blueBox,2);
alert("blueBox");

}

stage.enableMouseOver(frequency);
this.redBox.addEventListener("mouseover", mouse2.bind(this));

function mouse2()
{
this.setChildIndex(this.redBox,2);
alert("redBox");

}

stage.enableMouseOver(frequency);
this.greenBox.addEventListener("mouseover", mouse3.bind(this));

function mouse3()
{
this.setChildIndex(this.greenBox,2);
alert("greenBox");

}

[ClayUUID]

You only have to enable mouseover once, not three times.

Now, I'm going to guess that you're using Animate 2020 for some reason. If you are, try adding this.stop(); to your above code.

[asmithAPV]

I changed it to only enable mouseover once, but nothing changed.

I am using Animate 2020. Where should I add the stop? Why should I add the stop?

[ClayUUID]

I already told you where to add it. Add it to your above code. So wherever that code is, that's where you add it. I don't know where that code is. You do.

[asmithAPV]

You don't need to be rude about it. I was asking where specificially in that line of code to add it.

It's added. It doesn't work.

[ClayUUID · Accepted solution]

Well I'm out of ideas then. I tried your code in 2020, with this.stop() added, and it worked perfectly.

Perhaps try this:

this.stop();
stage.enableMouseOver();

this.blueBox.addEventListener("mouseover", mouseOver);
this.redBox.addEventListener("mouseover", mouseOver);
this.greenBox.addEventListener("mouseover", mouseOver);

function mouseOver(evt) {
	var p = evt.currentTarget.parent;
	p.setChildIndex(evt.currentTarget, p.numChildren - 1);
}

[asmithAPV]

Thank you very much, that worked for me. I appreciate your time.