Trigger Edge Animation on page load

I am using multiple Edge Animations in a DPS document I am creating. When I open the book, all of the animation begin to play at the same time.
Is there a way to trigger the animation to start when the user turns to the page the animation is on?

I'm trying to accomplish the same with recent versions of indesign and edge CC, but I'm not having sucess with autoplay and .125 delay.
Is there a work around for CC?
Thanks,
Erik

Similar Messages

For IE8, can I load static image instead of Edge animation (see page)?

I'm just roughing out a new site and my Edge animation isn't showing in IE8. I've googled and can't find definitive info on whether Edge 4 has support for IE8. I'm assuming not. My question is... is there a way to load a static image for IE8 so at least there is an image to fill that space? This is just going to be a huge roadblock to me continuing to use Edge unfortunately! IE makes me crazy!!!!!! http://www.duenorthdesign.com/hwt

Well if you look at the code in the url you supplied they are serving NON-IE browsers <![if !IE]> desginated by the ! mark the css and scripts files that are needed to make edge run correclty. Looking at the code in your page you don't have any of those scripts attached.
<![if !IE]>

    <script type="text/javascript" src="edge_includes/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="edge_includes/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="edge_includes/edge.0.1.1.min.js"></script>
    <script type="text/javascript" src="edge_includes/edge.symbol.0.1.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="index_edge.js"></script>
    <link rel="stylesheet" href="index_edge.css"/>

   <![endif]>

Edge animation fails to load first time in Opera, Crome but work in Firefox and Safari, both localy and

Hi guys, I have quite a serous problem here, I have a Adobe Edge Animation (done in CC) that fails to load the first time in Opera and Crome but does work in Firefox and Safari. It fail to load every time coming from another page.
The problem persist both locally and online. It does work in preview every single time.
I you can push me in the right direction, that would be great.
Thanks!
Here you can see the animation:
http://tierraburritos.com/test/laCarta.html

It seems to because of a style insertion error in animate library/content
Is it possible for you to share/mail your files with us,we can isolate the issue.

Animation while page loading

I just created an animation using fireworks that according to
the tutorial can be used as animation while the page is loading.
What format does this file need to be in and where should i upload
it on the server ...(anyone have a tutorial)...the one i used went
step by step how to make it but didn't talk about getting it to
work on the site....thanks

"whatisgood" <[email protected]> wrote in
message
news:go3jlv$29$[email protected]..
>I just created an animation using fireworks that
according to the tutorial
>can
> be used as animation while the page is loading. What
format does this
> file
> need to be in and where should i upload it on the server
...(anyone have a
> tutorial)...the one i used went step by step how to make
it but didn't
> talk
> about getting it to work on the site....thanks
>
Im not that savvy with animation in FW, but Im assuming that
it would be an
animated gif format.
Where you put the image, the actual folder or path isnt so
much the
important thing, as making sure you have correctly linked to
the image
destination on the page.
When you upload to the server, make sure that you maintain
the file
structure of your local files. If you are using dreamweaver
for ftp and you
have correctly defined your site in dreamweaver, then
uploading the image
from you local site files should maintain that structure.
Hope this is of some help
Regards
Fiona

Edge animate composition not loading on Business Catalyst catalogue's sub-catalogues...

Hi,
I need urgent help on this one... I have this edge animation slider on the all the pages of the website and its loading perfectly on all the other pages accept the sub-catalouges of our online shop, i believe this issue is caused because if the relative URL thing, but I'm not sure how to correct this, which code should i add and to which files, please help, i have an urgent deadline to meet and i couldn't fix it, i hope you guys here would help as we paying every month for your services.
Thank you very much..
Cheers,
Sam

Hi Liam,
Thank you very much yes that what i thought too, sorry i can't leave a link out in the forum coz the client wants to keep the project confidential at this stage, but i can PM you a link...
So you mean i have to edit the links in edge animate too? at first i couldn't get the shop template's css to load in subcategories, so i changed the links like that (/filename.css) and it worked but the edge animation wouldn't load when changing the paths for the files referred in the edge code that you put inside the head tag. So i'm guessing there must be some other paths that can't find its way around... and i found the below link last night, maybe this will work but I'm not sure how to put the javascripts and how to add the variable declaration to the root of my website like how they have mention in the below article, I'm more of a designer then a programer, but I'm learning on it, it would be great if you could tell me exactly whats that code and how to do it properly.
Adobe Edge: Embedding Animations in a Page | Daniel Hanly

Edge Animation plays only after page refresh in Firefox

There is an issue with animation playback in Firefox (I have the newest version - 27.0) - it works only after page reload or if you go to another page and come back to the home page.
I've saved Edge animation as .oam package and placed into Muse. My animation is floating clouds right above roof on homepage.
When I open html generated by Edge Animate in Firefox it works perfectly at once.
Please help!
I would appreciate any advice.
Thanks!
Here is my site http://www.digidom.kz.

Same FF version here, your page loads fine here, upon first visit and subsequent visits.
Have you tried clearing out browser cache; restart FF then reload/revisit your page.
Darrell

Mutiple edge animations on an index page

Hey there community
It feels like I have searched google dry, and I can't find the answers to my problems there, so I'm hoping this will help.
I'm creating a site in Dreamweaver with a lot of interactivity, mostly by edge animate. I have many animations on the index page of the site, and some fewer on other pages.
The problem is, every single edge animation is generating an edge_include folder for the files to work, when i insert the oam file.
The first loading time for a user is immense, around 10 sec.... Is there any solutions to remove those similar server request and make them all request from 1 folder with the edge.min and jquery.min file?
Mikkel Madsen

Many thx!!! I Will try the folder option. Do I have to open the edgepreload in a text edit program to change some urls? Or Can i just put every script in an edge folder with an image and include folder in that ?:):)
Mikkel Madsen.
Sendt fra min iPhone
Den 28/10/2013 kl. 10.20 skrev gcgCui <[email protected]>:
Re: Mutiple edge animations on an index page
created by gcgCui in Edge Animate CC - View the full discussion
Hi, hope I can help you. I´m finishing an interactive book with games and I use 3 project with different scenes on them. So you can try something like my trick. You can use "symbols" to make all your different animations on a single "Edge project" or if you wanna use your actual projects put all your images on a single "image folder" and use one "edge includes folder".
I have 3 projects on the root folder but just one image folder and one edge includes, each project have their own preload and the time loading is fast on web an mobile device.
Gabriel Cerra.
Please note that the Adobe Forums do not accept email attachments. If you want to embed a screen image in your message please visit the thread in the forum to embed the image at http://forums.adobe.com/message/5793206#5793206
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: http://forums.adobe.com/message/5793206#5793206
To unsubscribe from this thread, please visit the message page at http://forums.adobe.com/message/5793206#5793206. In the Actions box on the right, click the Stop Email Notifications link.
Start a new discussion in Edge Animate CC at Adobe Community
For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.

How to integrate Edge Animation into a Joomla-CMS page?

I tried to integrate an Edge animation into a Joomla site, but there appears just a white page...

Hi,
I guess I have two answer on two levels. The wordpress plugin (EdgeSuite) allows you to place compositions inline or use iframes, so it is not really plugin vs. iframes.
EdgeSuite brings various benefits (if you ask me):
First of all, it comes down to just uploading stuff, place it, done. No ftp upload, filehandling or whatsoever.
More over that the plugin enables sharing of core edge libraries. E.g. if you place two compositions on a page without modifying them, all the edge libraries (edge.js, jquery, yep, easings...) will be loaded twice as they sit in different directories. Same with viewing compositions on different pages, each composition loads its own set of libraries. 10 different compositions results in 10x loading of all libs. Edge Suite on the other hand alters the path for the resources and places them in one directory. Libs are only loaded once, for the whole page.
If you have a simple website cluttering your webspace at root level might be an option. If you are using a CMS and have 10 compositions that is just awful. EdgeSuite places all composition files in a clean file structure within subfolders, no cluttering.
That's just from the top of my head.
The iframe topic is a bit more difficult. Personally I think iframes are mostly bad practice. It's like in the early days of the web with table layouts and framesets. There are cases where iframes make total sense and are the best way to go and that's why EdgeSuite can also render iframes. But I personally only want to "see" an iframe when there is no other option. If you can do it inline, do it inline. Bad SEO, loading times, semantic fragmentation... security aspects, sandboxing on the other hand are just a couple of the most common arguments. Most of the arguments don't directly apply to the context of Edge Animate, but still... decide for yourself
Hope that answers your question to some degree.

Stopping Edge animation play after page visit.

I have an Edge animation as a banner on my homepage. I was wondering how, if for example someone landed on my homepage the animation plays out, then navigates to my portfolio page, then back to the homepage, the animation would not play again. I think I'm trying to go the more is less route, also I think it will increase overall page loading speed, than trying to replay the animation everytime you return to my homepage. I hope this made sense. Thanks.

Hi there, the first thing that comes to mind is to use session storage. Set a variable "isFirstTime", and check it on Stage.compositionReady in Edge. You can then jump to the end of your timeline, effectively skipping the animation. Alternately, you could set and check session storage outside of Edge, and swap out the div's contents to either contain Edge content, or a static image, etc.
Here is a good example:
http://www.w3schools.com/html/html5_webstorage.asp
Session storage stores data until the user closes the browser, so they would see the animation again if they closed the browser and visited your site they next day, but they wouldn't see it again on the same visit.

Edge animation in Wordpress site slow to load.

Hi clever Edge people.
I have an (simple) Edge animation I am putting into a Wordpress site but it takes forever to load when looking at the site on a browser - trying it on ipad, Google chrome, firefox, and safari. The .oam file is 1.9mb. Is that big?
Here is the link (site in development so kinda messy!):
http://everywhereyougo.co.nz/2012/11/shakespear-regional-park-2/
How does it load for you? Any clues about why it is slow?
Thanks!
Lisa

Hi Lisa,
first of all thanks for using EdgeSuite for wordpress. Did you use shortcodes? Would it be ok to use your site as a reference for edge suite, I would list it on edgedocks.com if you would agree?
Now to your question: By looking at the network traffic you can tell that your homepage is more then 3.1MB big, thats quiet a lot. Use google pagespeed extension for chrome, yslow for firefox, the network tab in firebug or just http://www.webpagetest.org to get an idea of what's going on.
For example, the three icons FB, twitter, vimeo are each 500KB big, so these three icons are already have the size of your page. That is one thing to fix, but probably not the only reason for your composition to load slowly. You are using a lot of small assets, it just takes some time to load these. Does the composition load right away locally? If you want to further reduce loading time you could use spritesheets. You can combine small images within a bigger image and clip the focus when using the image as a backgound for a div. And try to reduce Photo1 2 3, each 150KB big.
What about adding a preloader for the animation, the then user at least knows that there is more to come.
Just suggestions.

Custom Page-Loading Animation?

I am wondering if there is a way to export a custom animation out of edge animate or after effects and use it to replace the stock loading status bar in a Muse site?
If not, maybe there is a way to add it in on the Business Catalyst end?
Ive looked everywhere and cannot find an answer or anyone even talking about it. :/

search for "preloader" - they yhave been around for years and
hundreds/thousands of tutorials all
over the web - i myself post links to preloaders in the forum
weekly:
www.kirupa.com has some
www.gotoandlearn.com
there are more if you want to google or search forum archive.
--> **Adobe Certified Expert**
--> www.mudbubble.com
--> www.keyframer.com
margietravis wrote:
> All I need is the animation that shows the page loading
until it does. The rest
> of the site is html (done in Dreamweaver) but there are
several pages with
> flash that are taking a long time to load. I don't know
why I'm having such a
> hard time finding what seems to me to be one of the most
simple/common
> animations. Can anyone point me in the right direction?
>
> Thanks.
>

Link Edge animation to HTML page?

Is there a way to link my Edge animation to an Index HTML page in the same folder as the Edge.HTML? I linked a webpage with the OpenURL trigger and it worked. But I would like to link it to the index page within the same folder so that I can test it before uploading it to the internet.
The trigger link that worked is:
window.open("http://www.mywebsite.com", "_self");
But can I use something like:
window.open("index.com", "_self");
Thanks,
Susan

Susan-
You don't need the sitename - just use this (assuming you are calling it from the same directory as you said):
window.open("index.html", "_self");
Else, you should be able to use this if it one folder deep:
window.open("../index.html", "_self");
James

EDGE animation plays before I come to the page in an Article

Hello,
I have created an EDGE animation, and, it plays before I get to the page in an Article.
I have created other animations and placed them into articles and other folios, but, on this, it does not play correctly. I would like it to play upon entering the page or going to the page. but, when I enter the page it has already palyed. Might you have some hints or answers?
Thank you,
L

Need to set a delay on it with Folio Overlays panel I believe, little tricky if
its in a smooth scrolling page as that maybe loaded in one go, even
though it should tile.

Custom fonts not loading while Edge Animation inside an iFrame

Hi can someone help me with this strange problem? Custom fonts, specifically, Typekit fonts I used in my Edge Animate animation is not loading IE 11 when the animation is inside an iFrame. If you view the animation HTML directly on the browser, the fonts load perfectly fine.
Here is an example where the animation is inside an iFrame and part of a webpage where fonts are not loaded when using IE11.
http://www.pandaequipment.com/test/contact.html
and here is the HTML file directly where fonts and loaded fine in IE 11
http://www.pandaequipment.com/test/edgeanimate_assets/myhero/Assets/myhero.html
All the other browsers I tested don't have this problem.
Can someone tell me some ways to fix this in IE?

Hi Keith,
I'm sorry that you ran into trouble with this. I also saw this issue when I tested your site in Chrome on OS X 10.9, although the fonts worked on reload because they were then cached in the browser.
I suspect the the issue is in the "src" attribute on the iframe:
iframe allowtransparency="true" frameborder="0" scrolling="no" src="edgeanimate_assets/myhero/Assets/myhero.html"
Would you try changing the src to a full path, and see if the fonts load into the iframe?
iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://www.pandaequipment.com/test/edgeanimate_assets/myhero/Assets/myhero.html"
Background: Typekit gets the domain name from the browser referrer and uses it to check that the site matches the listing on your kit. This is one of the security layers to make sure someone can't steal your Typekit fonts and use them on their own site. When loading fonts into an iframe, the iframe referrer needs to match as well.
If the iframe referrer doesn't match or is blank, the behavior is browser-specific. Some browsers will use the referrer of the parent page and so the fonts load, while others don't apply the fonts at all.
Setting the iframe src to the full URL should ensure that a referrer is sent, and may fix this issue.
Please give that a try, and let me know how it goes! Thank you,
-- liz

Bootstrap, height of edge animation and others div content in the page- overlay issue

I’ve a problem with the position others div tags in a page with a edge animation in the top (in the below example, div “box-animation”… export it with “publish target: Web”).
The static content (in the below example, class “content-static”) is always overlay to the animation, instead to view it below div “box-animation”.
The first solution is to set an height for edge animation container (for example, #box-animation height: 500px) but its very complicate to manage it with responsive website.
So, how to view the static content in a div tag after an animation create with edge animate, to avoid overlay effect?
This my first animation with Edge Animate and I always thought that the animation would have been placed in the html order of the webpage...
Thanks
Example:
<body>
<div id=“box-animation”><div id="Stage" class=“animation1…”>[edge animation]</div></div>
<div class="container">
<div class="row">
    <div class="span12">
      <div class=“content-static”><p>Test content</p></div>
    </div>
</div>
</div>
</body>

Hi... put a trasparent gif image, with the same animations's width/height, in the first div after the edge code container.
If you want responsive layout, remember to remove width/height values.
<body>
<div id=“box-animation”><div id="Stage" class=“animation1…”>[edge animation]</div></div>
<div class="container">
<div class="row">
    <div class="span12"><img src="images/spacer.gif" alt=""/>
      <div class=“content-static”><p>Test content</p></div>
    </div>
</div>
</div>
</body>

Trigger Edge Animation on page load

Similar Messages

Maybe you are looking for