How to place button "over" graphics above all other button layers?

[megand68912768]

I have multiple buttons in layers on a timeline.  Because the buttons are in separate layers, the rollover state of each button pops up behind other buttons on the map. How do you make the rollover state appear above all other inactive buttons on higher layers in the timeline?  Screenshots attached.

[JoãoCésar · Accepted solution]

Hi.

You can add event listeners to your buttons like this:

function bringToTop(e)
{
	e.currentTarget.parent.addChild(e.currentTarget);
}

this.stop();
this.yourButton0.on("mouseover", bringToTop);
this.yourButton1.on("mouseover", bringToTop);
this.yourButton2.on("mouseover", bringToTop);
// and so on

Regards,
JC

[megand68912768]

I will try to figure out how to do that thank you.

[JoãoCésar]

You're welcome.

Please let us know if you need further assistance.

Regards,

JC

[megand68912768]

Apologies for my ignorance here I don't know how to assign the code to the timeline.  Here's what I have so far.  I'm sure I'm missing some code or functionality as the test still displays the popups underneath higher layers.

[JoãoCésar · Accepted solution]

Hi again.

No need to apologize.

You just need to move the lines that add the listeners from within the function body and place them in one of the lines below like in the image.

[megand68912768]

That is amazing! IT works thank you so much!!

[JoãoCésar]

Awesome! You're welcome!