Inspiring

Answered

OAM file not responsive in Dreamweaver

Forum|Forum|7 years ago
August 3, 2018
2 replies
1409 views

OAM files are not responsive in Dreamweaver. Using responsive export publish settings in Animate CC latest version, I insert .oam file as an animated composition into latest dreamweaver with fluid layout and get this:

</object>

Width and height are hard coded and not responsive. If I change width to 100% it will scale but the height does not.

This leaves a large gap below animation and additional content on page.

If I set height to a percentage (100%) the animation becomes very small around 40x40px. If I remove height it disappears. I've been using Flash since it came out but can't transition to Animate CC without this fix. Please help.

This topic has been closed for replies.

Correct answer ichristman

The solution is to add css for your html.

<style>

.mycontainer{

min-height: auto !important;

}

</style>

and add the class in your object

</object>

May not have implemented correctly I'm still getting gap. My site is bootstrap 3 so I tried this:

</object>

</div>

and it is working. Note: width can still be hard set and I may need to keep my animations at 16by9 or 4by3.

Thanks for your help. I'm going to experiment more with min-height: auto !important;

M

mondelplasmid

Participant

When publishing the animation, check center stage, make responsive, and the thing that made the difference for me - scale to fit visible area select FIT IN VIEW from drop-down.

avid_body16B8

Legend

I think when you publish an OAM package with scale to fit visible area, if you have a width and height values in your object it represents the box in which the oam will stretch. So basically your OAM is responsive in that area, if that makes sense. At least this was my understanding for OAM created with Edge Animate CC.

I

ichristmanAuthor

Inspiring

thanks for you quick response

Yes, If height is set to 400px and width is set to 100% the oam/canvas embed in TexasAniCheck.html will scale to 400px high, if it hasn't reached 100% width yet.

The default insert size is the document size in animate cc.

Where I run into trouble is when I scale down the browser to mobile width (say 400px). A document that is originally 800px wide and 400px high with width changed to 100% will now be 400px wide and only 200px high leaving 200px gap before I can add more content below.

Setting the height correctly to keep it proportional with the width is what I'm struggling with.

avid_body16B8

Legend

The solution is to add css for your html.

<style>

.mycontainer{

min-height: auto !important;

}

</style>

and add the class in your object

</object>

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded