0 Replies Latest reply on Apr 23, 2017 8:28 AM by Saariko2

    Animate-CC HTML content not clickable when not in iFrame.

    Saariko2 Level 1

      Hey all

       

      I have a rather complex question for the more experienced and knowledgeable people of how the Animate-CC/CreateJS/EaselJS engine works "under the hood", especially how the engine translates DOM mouse interactions to CreateJS interactions.

       

      Please see a demo I developed HERE.

       

      Press the play button on the video, and you will see a clickable creative box appearing on top of the video.

      Also note, through the Console, that clicking the box loges two events:

      stage is clicked
      canvas is clicked

       

      Meaning, both DOM and CreateJS listeners are triggering. Code is:

       

      this.stage.addEventListener("click", function(){console.log("stage is clicked")});
      this.stage.canvas.addEventListener("click", function(){console.log("canvas is clicked")});

       

      Now please see THIS. - (Please check on Chrome only).

       

      Click the >Play button.

      On Chrome you will see the box, but won't be able to click. The Console shows that only the Canvas is reporting a click.

      Note that there are no errors in the Console.

       

      In both pages, the Animate-CC/CreateJS code is the same.

       

      Now, granted, I have done a LOT of changes to the way the generated files are structured, and my code is loaded into these 2 different pages, which are structured differently - most noticeable, the first page is "hosting" the Canvas inside an iFrame, while the second doesn't.

       

      I know this is a long-shot, and this having the creative clickable?

      Bad CSS? CORS issues?

      Anything else I should look into?

       

      Thanks a lot in advance