How do I scale an Edge Animate comp afterwards?

Is it possible to scale an Edge Animate composition after you made it?
I made a composition, but I want to rescale the whole thing. I can change the stage values, but still have to resize all the elements. First of all that's a lot of work when you have a lot of elements and second of all the elements don't always keep doing what they're supposed to do for some reason.

moved to the DPS forum....

Similar Messages

How do i actually view Edge animate content at 100% on a connected device??

Hey,
I'm working on a mobile mockup in Edge Animate, the resolution is 1280px high x 720px wide. I am previewing the output on a HTC One X via Edge Inspect.
It is working fine (once I figured out how to use the reponsive layouts feature in Edge Animate) but the android status bar and the 'dock' menu within Inspect are squashing my comp vertically so the preview is not in fact 100% scale... my 1280px high comp is now squashed to 1134px. Doesn't exactly give an accurate view of the final product...
It seems to me that the 'Show full screen on devices' is a bit misleading, or is it just how android handles this?
Any help much appreciated.
lance

Hi Lance,
I'm not entirely clear on what you're seeing, could you possibly take a screenshot and post it here if I've misunderstood what you're describing? Thanks, meanwhile, I'll do the best I can to help.
There are two things that may prevent your mockup from taking up the entire screen on Android. There is the Android status bar and our Edge Inspect UI chrome that shows the URL and a couple of buttons. The Edge Inspect chrome you should be able to easily remove by choosing the full screen button within the Chrome extension. "Show full screen on devices" may be a bit misleading it's true, because when you click that we don't also hide the Android status bar. That is however, by design, since that status bar will remain visible on devices while your page is being shown in the native browser on the device, so we're giving you an accurate representation of your page.
Hope this helps,
Mark

How do I use an Edge Animate project with SVG files in InDesign for DPS output?

Is there any way to include an Edge Animate web content using .svg files in InDesign for output to DPS?
Edge Animate works great with InDesign, except for when you're using SVG files. I've worked with SVG files on the web successfully (writing .htaccess files and such), but it seems like InDesign doesn't like them.
This is pretty important because I don't want to have to design multiple renditions on the DPS suite. Currently I have it setup as a PDF format (DPS) and that scales all of the vector-based type perfectly. It would be wonderful if the animations could also be in a vector format so that when the iPad (3) users see the designs, they will scale naturally through the PDF framework.
Any advice would be invaluable.
Thanks!

moved to the DPS forum....

How do I keep an Edge Animate banner ad file size small?

Most publishers cap the file size of banner ads at 30 KB to 50 KB. Is that possible using Edge? I know someone asked a question like this two years ago, and the reply was to use a CDN to serve the larger .js files. Is there a more direct approach now that Edge is no longer in preview? Thanks!

Hi SGPGirl,
We were just forming what became the Edge Animate team two years ago, so many questions were asked at that time. The 30k-50k ad standards were built with Flash in mind; HTML advertising standards are still emerging. In the meanwhile, we are making a continuing investment to improve the form factor of Animate output. Here are a few things we've done so far in "Publish":
- Frameworks via CDN (for jQuery)
- "Polite" preloader - this allows you to sneak-in under 30k size limits. It shows a light-weight "preloader" and then pull in a larger payload after the page has loaded. The preloader UI contains a meter that indicates the gzipped size of the preloader including its resources.
- Compressed composition output. When published, the animation (xyz_edge.js) is written in an efficient/compact form that shaves as much as 80% from the composition size.
I'd be grateful for your perspective on the "polite preloader" approach vs. trying to fit the entire composition into 30k. If Animate were to support an "areo-gel weight" output format, what kinds of experiences would you expect to produce with it? If you have any examples, please share!
- Josh

How can I upload my edge animate .html to the web.

I can't figure out how to upload my edge files to my web host with getting a blank page?

this is how i have it set up

HOW TO DO VALUE ADOBE EDGE ANIMATE CONNECTED WITH JQUERY FOR DATABASE MYSQL??

Please give me a suggestion...
thank's attention...

Check this link out:
Receiving INPUT TEXT, making Forms from scratch.
The idea is that a symbol is created and the input controls are created or attached to the symbol. For example, we create a rectangle on the stage, convert it to a symbol then name it "username". We can then do the following:
sym.$("username").append('<input/>').attr({ type: 'text', name:'text', value:'text'});
Add the above code in the stage compositionReady event. The above will add a text input control.

How do you upload Edge Animate on Adobe CDN?

How do you upload Edge Animate on Adobe CDN?

Hi Darrell,
I'm using an exciting new software package called www.webflow.com and I asked the following question in a forum:
Hi,
How would you add this Edge Animate to Webflow? Is it possible?http://html.adobe.com/edge/animate/showcase/interactive-marquee/11
The files are available here: http://html.adobe.com/edge/animate/showcase.html6
Edge Animate gives you a few different option for publishing:
The drop down that you see in the image next to "Chrome Frame Installer" has three options:
Now Prompt
iFrame Prompt
Overlay Prompt
These are the files saved when only "Publish content as static HTML" is checked. See "Publish Settings" image:
Is it possible to add this animation to a Webflow site?
If yes, any suggestions on how would be greatly appreciated.
Thanks,
Todd
Here's Sergie's reply:
Hi @TStanwood, it's possible, but the only way to do it is if you host your files on Adobe CDN or if you host it on your own server and then display an iframe with the index file in Webflow.
That's the way to do it before we allow for hosting of non-image files on Webflow.
After you have them hosted on your own server you can follow these instructions found on the Adobe forums:http://forums.adobe.com/thread/1166851
You'll have to add this to your head code:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="Bannerad_edgePreload.js"></script>
    <style>
        .edgeLoad-EDGE-160548878 { visibility:hidden; }
    </style>

Replace Bannerad_edgePreload.js with the link to your server and the edge js file.
And in the Webflow add a div block with the class EDGE-160548878 and id stage and the .js file should inject your html animation file into this div block.
<div id="Stage" class="EDGE-160548878">
</div>
I don't have a server to upload the files to. I really don't even know what any of this means.
I'm wondering how and where I can upload the Edge Animate files to and then link to it by following the instructions above.
Any help would be appreciated.
Thanks,
Todd

Edge Animate: Change URL, Back and Forward Buttons (JS window.history)

Hi,
I want to build complete homepages with edge animate and i am on a good way but i have only one problem.
A site built in Edge Animate seems to has fluently changes from site to site because it is only one site.
So i have to simulate the feeling of junping to next site ore move forward
An exaple: I have built a site with edge animate with the home button, info button and a contact button.
i can switch fluently from one to the other. so it seems that it is a complete homepage but when i am on contact or on info i cannot klick to the back button on the browser.
so i found on web that i can change the url state.
i made a symbol then made a click event and put the line ---> window.history.pushState("Foto", "Title", "/photo");
now the Url changes from "example.com" to "example.com/photo"
Now the problem: How can i say to edge animate, that when i click the back button on the browser that it hast to go to timeline on a label?????
Please answer me.
I am sleepless until i understand it

Among other things, you have a lot of code errors which modern browsers don't like. X-UA Compatible is necessary for IE browsers. So you can ignore that one. Or if you like clean code, put that meta tag inside an IE conditional comment.
The rest of these errors need attention.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fenergywallwindows.com%2Ftemp%2Fco llections.html
Also, why are you using tables for layout? CSS is much more efficient.
Nancy O.

How do I know if my Edge Animate compositions will scale up or down to fit each mobile phone platform's resolution? iPhone 3s, 4, 4s, 5, and 5s all have different resolutions. Do I use .png or svg?

I want to use Edge Animate to create native app in PhoneGap Build. How do I know if my Edge Animate compositions will scale up or down to fit each mobile phone platform's resolution? iPhone 3s, 4, 4s, 5, and 5s all have different resolutions. And do I use .png or svg?

If you use responsive scaling it will definitely scale .
For best practises regarding graphics refer
Edge Animate Help | Best practices for graphics in Adobe Edge Animate

Are Adobe EVER going to make Edge Animate scale-to-fit (like Flash)?

I've been following the progress of Edge Animate (formerly Edge) ever since Steve Jobs decided he wasn't having Flash on the iPad.
With each new version I've been desperately looking for the feature that I consider the most important of all: Scale-to-fit
There are a couple of discussions already on this forum where people have requested this feature - but both have been sidetracked by replies from people who haven't understood what 'scale-to-fit' is. So let me explain Scale-to-fit:
I'm talking about the feature in Flash - where if the HTML dimensions are set to 'Percent' - then the resultant movie will scale-to-fit any browser window. Here is an example of what I mean:
http://www.skippingschool.co.uk
- try changing the browser size and you'll see the whole frame (graphics and images) scales without changing its proportions.
When the latest version of Edge Animate came out with its built-in easy-to-follow 'Resize' Lesson, I thought Adobe had finally found an answer. But good though this feature is, it doesn't solve the problem. It's only possible to properly scale-to-fit images - not graphics.
It's now more important than ever that Adobe finds a solution to this problem. The world is going 'Responsive' - its not just a fad. And 'Responsive' is not just about three columns being squeezed into one. All Responsive sites require images, graphics AND animations to scale-to-fit. So Adobe's tutorial showing how Edge Animate can be added to WordPress sites is of limited use because it won't work for Responsive web sites.
So please Adobe, will someone tell me if scale-to-fit is EVER going to happen? I don't mind if it's 3 months, 6 months, 9 months down the line - but I need to know if it's worth me sticking with Edge Animate - or whether I should be looking toward HTML5 Canvas or something else for a solution?
Alternatively, is there some fundamental reason why it can NEVER happen?
Please tell me? Just put me out of my misery!

Hi Sarah,
I hope you don't mind but I played around with your code a bit and managed to get the kind of scale-to-fit behavior that I believe the OP was asking about. I think the trick is to make sure that you also check whether the scaled height of the stage exceeds the height of the browser window and change the scaling so that it is responsive to changes in both the width and height of the window, whichever is the limiting factor. The code I changed in CompositionReady appears in bold below. I hope this helps.
sym.$("#Stage").css({ // Set the transform origin so we always scale to the top left corner of the stage
"transform-origin":"0 0",
"-ms-transform-origin":"0 0",
"-webkit-transform-origin":"0 0",
"-moz-transform-origin":"0 0",
"-o-transform-origin":"0 0"
function scaleStage() {
    var stage = sym.$('Stage'); // Set a reusable variable to reference the stage
    var parent = sym.$('Stage').parent(); // Set a reusable variable to reference the parent container of the stage
    var parentWidth = stage.parent().width(); // Get the parent of the stage width
    var parentHeight = $(window).height(); // Get the browser window height
    var stageWidth = stage.width(); // Get the stage width
    var stageHeight = stage.height(); // Get the stage height
    var desiredWidth = Math.round(parentWidth * 1); // Set the new width of the stage as it scales
    var desiredHeight = Math.round(parentHeight * 1); // Set the new height of the stage as it scales
    var rescaleWidth = (desiredWidth / stageWidth); // Set a variable to calculate the new width of the stage as it scales
    var rescaleHeight = (desiredHeight / stageHeight); // Set a variable to calculate the new height of the stage as it scales
    var rescale = rescaleWidth;
    if (stageHeight * rescale > desiredHeight) // Do not scale larger than the height of the browser window
                    rescale = rescaleHeight;
// Rescale the stage!
           stage.css('transform', 'scale(' + rescale + ')');
     stage.css( '-o-transform', 'scale(' + rescale + ')');
           stage.css('-ms-transform', 'scale(' + rescale + ')');
     stage.css('-webkit-transform', 'scale(' + rescale + ')');
           stage.css('-moz-transform', 'scale(' + rescale + ')');
     stage.css('-o-transform', 'scale(' + rescale + ')');
           parent.height(stageHeight * rescale); // Reset the height of the parent container so the objects below it will reflow as the height adjusts
// Make it happen when the browser resizes
$(window).on('resize', function(){
           scaleStage();
// Make it happen when the page first loads
$(document).ready(function(){
    scaleStage();

How do I include 'Edge Web Fonts' into Edge Animate?

How do I include 'Edge Web Fonts' (not Google Web Fonts) into Edge Animate?

Have you tried to use google fonts? I have used them and they work for me.
When you add your font for example:
Copy paste:
<link href='http://fonts.googleapis.com/css?family=Finger+Paint' rel='stylesheet' type='text/css'>
and then for font family.
'Finger Paint', cursive;
then select addfont on the addfont screen

How to make something like this in Edge Animate?

Hi,
I'm hoping to make something like this – https://www.youtube.com/watch?v=OJeDppEHI1g – in Edge Animate but I'm not sure where to start.
I'm new to Edge but am keen to explore.
Anyone have any feedback on whether:
1. It's possible, and
2. What techniques/effects have been used.
Thanks!

Hi there and welcome,
Could you be a little more specific on what it is exactly that you would want to create? Most of what I can see from that website is doable in Edge Animate, but if you specify what it is you'd like to accomplish I could walk you through how to do it.
Thanks!

How do I pass a variable from edge animate to an external JS?

I need to pass a variable value from Edge Animate to an external JS file. How can I do it?

Not sure if this is the best way ,but works
Set the variable as a property of a global variable
Like
SET
window.myVar = 'your value';
AdobeEdge.myVar = 'your value';
Read
window.myVar
AdobeEdge.myVar

How do I upload the entire Edge Animate folder to the cloud?

How do I upload the entire Edge Animate folder to the cloud?

Hi there,
Are you talking about the Creative Cloud? If so, you can compress the Edge Animate files into one folder as a .zip file, and then upload the entire .zip file by clicking the Upload button on Creative Cloud:
I hope this helps! Let me know if you need further clarification! : )

I already have the Adobe Creative Suite but I do not have Edge Animate, how do I get it?

I already have the Adobe Creative Suite, but I do not have Edge Animate, which I require for a course I am taking (only need for about 3 months), how do I purchase the single app? It is also not letting me download the free trial.

CC 2014 is not a separate plan, it is the newest version of the CC plan
http://blogs.adobe.com/jkost/2014/06/installing-the-2014-release-of-creative-cloud.html
This messages says (at least some) CC 2014 programs use NEW plugins https://forums.adobe.com/thread/1499663
-so do not uninstall the older CC programs if you use plugins in your programs until you are sure you have plugins that work in CC2014
If you are sure you don't need the old CC programs
-http://helpx.adobe.com/creative-cloud/help/install-apps.html to install or uninstall
-read reply #3 about the ORDER of uninstalling & installing https://forums.adobe.com/thread/1242671

How do I scale an Edge Animate comp afterwards?

Similar Messages

Maybe you are looking for