transparent background in adobe animate cc for oam file

Report · Feb 09, 2016

Hi,

I have problem in adobe animate cc, I want to transparent background for OAM file in adobe animate cc, before I place in indesign, Can you help me about this problem. Thank You for attention

Report · Feb 09, 2016

I'm assuming you're exporting OAM out of a HTML5 canvas document.

Just add the following line of code in Actions panel on the first frame before exporting:

canvas.style.backgroundColor="rgba(0,0,0,0)";

Let me know if you face issues.

Report · Feb 10, 2016

Hi, I try this way, but I have an error.

Scene 1, Layer 'Layer 1', Frame 1, Line 1, Column 7

1119: Access of possibly undefined property canvas through a reference with static type flash.display:Stage.

Thank you.

Report · Feb 10, 2016

Actions panel on the first frame before exporting:

canvas.style.backgroundColor="rgba(0,0,0,0)";

Does not work!!

Report · Feb 10, 2016

This will work on a HTML5 Canvas document only. You seem to be using this code on a AS3 document.

Report · Feb 10, 2016

I have the same issue, and I'm working on a HTML5 document. Missing Edge Animate already, want to create OAM's for use in Adobe Captivate and have been searching for hours to find a solution to have a transparent background. The Help is not updated (of course, seems to be very common problem with all Adobe applications), work flow described in Help is not valid anymore.

Report · Feb 10, 2016

You can use the following as a temporary workaround for canvas documents. Open the published html once and use a transparent color for the canvas:

</body>

then go to the publish settings and uncheck - overwrite html.

Report · Feb 11, 2016

Hi,

Thank you for helping me , I try " dharmk" solution and sucessfully for transparent in indesign.

regards

Report · Jul 15, 2016

Thank you!

Report · Feb 11, 2016

I understand. But I opened HTML5 Canvas in Animate CC . And the line of code " canvas.style.backgroundColor="rgba(0,0,0,0)";" I wrote. why not transparent option in Animate CC?

Report · Feb 11, 2016

Back to Edge Animate, lot more user friendly. Sorry, Animate CC, not only is the UI in many instances illegible (look at the screenshot I posted in my previous answer), but it lacks a lot of user friendly features that are present in Edge Animate. I will probably never use Animate CC to create games, my career is in consultancy for Captivate projects and their integration with Adobe applications (Audition, Photoshop, Illustrator...and I hoped on Animate CC). I deeply regret that such basic aspect like having a transparent background needs tweaking of published HTML, that even the small script mentioned by ougur's is not working.

Report · Feb 14, 2016

Sorry, I missed a line of code in my earlier post.

For exporting transparent OAM files from HTML5 Canvas documents in Animate CC, you can try this:

Add the following code-snippet in Actions panel on the first frame before exporting:

canvas.style.backgroundColor="rgba(0,0,0,0)";

document.body.style.backgroundColor = "rgba(0,0,0,0)";

Report · Feb 15, 2016

CODE SNIPPET FOR TRANSPARENT BACKGROUND.Open code snippets panel and import xml file (little grey gear top right.) To use select first frame on timeline open code snippets and double click on transparent background then export from publish settings LINK FOR CODE SNIPPET FILE....https://www.mediafire.com/?crtskn9ndqlmmc5 Hope this helps and thanks to Nipun...

Report · Feb 15, 2016

Thanks, finally succeeded in creating a transparent background. The problems I had before (trying to insert in Captivate) are now linked with looping not functional in OAM. A non-looping animation is no longer an issue. Thanks PerriDesign and Nipun! Any solution for looping animation?

Report · Feb 15, 2016

For looping go to Code Snippets once again, and open Html canvas: , select the last frame on your timeline, double click Select click to go to frame & play, where it says go to and play 5 which is the last line before close parentheses

change to 1 in the brackets. Then the normal publishing procedure etc... you should now have a looping animation.

Report · Feb 16, 2016

Hi,

Thank you , finally succeeded in creating a transparent background. Your solution is very easy and simple

regards

Report · Mar 30, 2016

Yes Yes it did work just place this action script in your very first frame of animation

canvas.style.backgroundColor="rgba(0,0,0,0)";

document.body.style.backgroundColor = "rgba(0,0,0,0)";

drag your .oam file to muse and that's it

Report · Jul 15, 2016

thank you! Works fine!

Report · Jul 16, 2016

Please note that the latest Animate CC release(June 2016) has a Support for transparent canvas background OAM publishing for Animate CC

In addition, this release has a lot more web publishing options such as Merging JSON/JS code, Embed JavaScript into HTML, HiDPI compatible HTML5 canvas output, Responsive scaling etc. Please refer New Feature Summary (June 2016) to learn more about the release.

Thanks!

Mohan

Report · Jun 03, 2016

The Nipun's answer worked for me. Thanks

Report · Jan 27, 2017

Yessss!!!! THANK YOUUUU!!!!

Adobe Community

transparent background in adobe animate cc for oam file

1 Correct answer