Skip to main content
Participant
August 12, 2017
Answered

Video component overlaps all the other animation items

  • August 12, 2017
  • 4 replies
  • 2813 views

The video component overlaps all the other animation items even though I have placed it on the bottom layer I am using an mp4 in the components video application. Is there a way to fix the problem.

    This topic has been closed for replies.
    Correct answer UDESCO

    If you'd like your video at the bottom and other animations playing on top of it, you can try this:

    1. Set the stage color to transparent in Properties panel.

    2. add the following line of code in Actions panel on frame 1:

              var dom_container = document.getElementById("dom_overlay_container");

              dom_container.style.zIndex=-1;

    This will place the Components as underlay instead of overlay to the canvas.

    4 replies

    Participant
    November 16, 2018

    I tried this and it worked on all browsers except Chrome.  That's a deal-killer.

    UDESCO
    Adobe Employee
    UDESCOCorrect answer
    Adobe Employee
    August 17, 2017

    If you'd like your video at the bottom and other animations playing on top of it, you can try this:

    1. Set the stage color to transparent in Properties panel.

    2. add the following line of code in Actions panel on frame 1:

              var dom_container = document.getElementById("dom_overlay_container");

              dom_container.style.zIndex=-1;

    This will place the Components as underlay instead of overlay to the canvas.

    fabiodessena
    Participant
    September 22, 2017

    I had the same problem and this worked!!!! Thanks so much!!

    Fabio

    Participant
    September 25, 2019
    Hi Fabiodessena, I have also same Issue "The video component placed it on the bottom layer I am using an mp4 in the components video application." but above video layer animation work not visible please help me. how to solve the issue.
    Legend
    August 12, 2017

    If you're working in an HTML5 Canvas document, components will always overlap everything on the stage, no matter what you do, because they're not drawn on the stage canvas. They're separate browser DOM elements floating above the canvas. It's physically impossible for anything on the stage to be above them.

    Participant
    August 13, 2017

    I placed the video component in a symbol and it did not work.  What if you change the file type to flv or another file associated with

    Adobe Animate. Is their any other possibility.

    Legend
    August 13, 2017

    You still haven't said whether you're working in an AS3 or Canvas document.

    Inspiring
    August 12, 2017

    Have you tried adding the video component inside a symbol? The video component is likely adding a video object as a child of the video component's parent, which would mean that the video object would be placed on top of everything else inside the parent. By placing the video component inside a symbol, the parent of the video component would be that symbol.