Can I change the z-index of an element (Animate CC and HTML5<canvas> project)

Contributor ,
Apr 02, 2017 Apr 02, 2017

Copy link to clipboard

Copied

Hi All,

I'm working on an HTML5 project.

I have three layers (A, B and C) in my timeline. Each has a movie clip on it. A is top-most layer on the stage (so hides the other 2 movie clips).

Can I make the movie clip on A appear behind C's movie clip according to the user's input? If so, is there any resource I could look at regarding that? (codePen, etc.)

Thanks much!

Views

4.4K

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
community guidelines

correct answers 1 Correct Answer

Adobe Community Professional , Apr 02, 2017 Apr 02, 2017

Likes

Translate

Translate
Adobe Community Professional ,
Apr 02, 2017 Apr 02, 2017

Copy link to clipboard

Copied

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
community guidelines
Adobe Community Professional ,
Jan 29, 2019 Jan 29, 2019

Copy link to clipboard

Copied

In the context of drag n drop you would want the currently dragged element to be on the top of every other elements if they are dragged to different place so it does not look weird.

I want to thank Martin Melendez for his drag n drop tutorial (  Drag And Drop (Adobe Animate HTML5) - YouTube  ). It is in Spanish. I am currently taking the time to translate it into English so people can choose the CC language. I will also post a tutorial on my site where I implemented things a little differently.

I put all the draggable items on the same layer. Then I used the following: this.setChildIndex(evt.currentTarget , this.numChildren - 1); on the mouse move event. Hope this helps.

function onMouseMove(evt) {

    var item = evt.currentTarget;

    this.setChildIndex(evt.currentTarget , this.numChildren - 1);

    if (item.drag) {

        var pt = item.parent.globalToLocal(evt.stageX, evt.stageY);       

        item.x = pt.x - item.offset.x;

        item.y = pt.y - item.offset.y;

    }

}

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
community guidelines
New Here ,
Jan 02, 2020 Jan 02, 2020

Copy link to clipboard

Copied

Thank you!!!

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
community guidelines
Adobe Community Professional ,
Jan 02, 2020 Jan 02, 2020

Copy link to clipboard

Copied

LATEST

Please do not bump year-old topics for the sole purpose of adding nothing to the conversation.

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
community guidelines