Highlighted

Stacked images come to front if you hover over them

New Here ,
Nov 24, 2019

Copy link to clipboard

Copied

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");

}

Adobe Community Professional
Correct answer by ClayUUID | Adobe Community Professional

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);
}
TOPICS
Code

Views

70

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Stacked images come to front if you hover over them

New Here ,
Nov 24, 2019

Copy link to clipboard

Copied

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");

}

Adobe Community Professional
Correct answer by ClayUUID | Adobe Community Professional

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);
}
TOPICS
Code

Views

71

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Nov 24, 2019 0
Adobe Community Professional ,
Nov 25, 2019

Copy link to clipboard

Copied

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.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 25, 2019 0
New Here ,
Nov 25, 2019

Copy link to clipboard

Copied

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?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 25, 2019 0
Adobe Community Professional ,
Nov 25, 2019

Copy link to clipboard

Copied

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.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 25, 2019 0
New Here ,
Nov 25, 2019

Copy link to clipboard

Copied

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.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 25, 2019 0
Adobe Community Professional ,
Nov 25, 2019

Copy link to clipboard

Copied

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);
}

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 25, 2019 0
New Here ,
Nov 25, 2019

Copy link to clipboard

Copied

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

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 25, 2019 0