Location of my images Edge Animate

Hi,
I have been trying to create a simple web page with few interactivity, it works fine in Edge Animate but when I view my page within a browser
It looks different as I think the position of my Images are all relative! is there any possiblity for me to get access to the CSS code of my images?
even when I zoom in or zoom out whithin my Web page, all the objects and images within my page change!
Thanks,

You might also want to post your file so that we can take a look at what you're seeing.
Thanks,
-Elaine

Similar Messages

When I type in a location for an object, Edge Animate keeps changing the location. For example, I enter the x-coordinate as 97 and it changes to 94. What's going on??

When I type in a location for an object, Edge Animate keeps changing the location. For example, I enter the x-coordinate as 97 and it changes to 94. What's going on??
I'm trying to put the object starting location very precisely and it won't let me.

With those specs, I'm surprised that it runs at all.
What kind of PC to use?

Edge Animate file working on main blog page but not on the individual blog post in BC

I recently uploaded an edge animate file to my blog which is host on Business Catalyst (BC). The edge file works on the main blog page but not on the individual blog post. How can I solve this problem?
I did the following steps:
I added the required Adobe Edge scripts on my main blog template.
Create folder on the server called "edge_includes" and uploaded the 'edge.5.0.0.min' file.
Create folder on the server called "js" and uploaded the 'jquery-1.7.1.min' file.
Copy and pasted the div to the part of the blog post I wanted the file to appear (<div id="Stage" class="EDGE-13973370"></div>).
Uploaded the name of the js file to the root called 'World of Code_edge.'
Uploaded the images to the existing folder called 'images.'

I'm still unable to figure out the problem.
Here is the link to the blog: http://goo.gl/sPW62j (the post titled "Basic Computer Science is a Fundamental Skill in the 21st Century Society").
Here is the link to the individual post: http://goo.gl/jTSgZH
Also, I get mixed results on the main blog page. Sometimes the image (Edge Animate file) on the main page shows and other times it does not. However, the image never shows on the individual blog post.

Edge Animate code output image location (X,Y) changes in Chrome and Safari

Hi there,
I'm working on my first project in Adobe Edge Animate, and so far it has been a miserable failure! Yay! Anyone out there interested in helping me out?
Here is a sample of the project so far: http://research.cs.queensu.ca/home/parker
My problem is that the green square's location appears incorrectly in Chrome and Safari browsers, but correctly in Firefox. I'm using a Mac Mountain Lion OS.
Why would an element have a different position when seen in a different browser? Note that all the other elements are displaying properly in all the browsers?
Thanks for your help,
-David

Try posting at the Web Development / Standards Evangelism forum at MozillaZine. The helpers over there are more knowledgeable about web page development issues with Firefox. <br />
http://forums.mozillazine.org/viewforum.php?f=25 <br />
You'll need to register and login to be able to post in that forum.

How do I use Edge Animate to make a clickable image which can be used in Author, and which will redirect you to a different page in your ebook?

If anyone has experience with Edge Animate, I know that I can make an image clickable, and I can insert a url to define where it will go once clicked. But I want to make a widget to use in iBooks Author, that can take the reader to a certain page of the book. Is this possible?
It all seems very complicated. Make one thing in Edge Animate, then somehow have that reference something in Author, which will finally work in an ebook. I have no clue where to begin.

Sort of. I'm using this code inside an action for a button symbol. But it doesn't work perfectly. Trying to debug it.
Let me know if you have any luck.
//Check to see if pageCounter already exists
if (typeof EC.pageCounter === 'undefined') {
// it doesn't exist so initialize it to first page
EC.pageCounter = 2;
//check if the page is only 1 digit -- patch for single digit
if (EC.pageCounter < 9) {
// it is, so we need to pad a 0 on the front.
EC.pageCounterString = "0" + EC.pageCounter;
//e.g. 01 ...09,11,12,13....115,222352,,....
else {
EC.pageCounterString = EC.pageCounter;
EC.loadComposition(EC.pageCounterString + "/publish/web/" + EC.pageCounterString + ".html", sym.$("container"));
EC.pageCounter = EC.pageCounter + 1;
//TODO for back -1

I have created a 468x60 animated banner in Edge Animate. How do I save the animated image to my desktop? (not in html code)

I have created a 468x60 animated banner in Edge Animate. How do I save the animated image to my desktop? (not in html code)

Hi,
This feature is not available in Adobe Edge animate. You can not export as image from Edge animate.
Publish options available in edge describe here
Edge Animate Help | Publish your content
Regards,
Devendra

Adobe Edge Animate CC crashes when using big SVG images

Hi!
When I import SVG files to Edge Animate it freezes and I can't do something with that.
I tried to import one file at a time and it worked fine but when I save project and close program and then open my project again Edge Animate just crashes.
Also I tried to import very small images (100px x 100px) and then scale them to size I need and it causing app crash too.
I'm using Mac OS X 10.9.4

I already found cause of this problem.
When you import SVG to Edge Animate it gives your SVG width and height 10 times more then original size of image and transform: scale(0.1). So when you import 5 SVG images 500x500 Adobe Edge makes them 5000x5000.
So that's cause app freezing and bad SVG displaying in browsers.
Always change scale(0.1) to scale(1) and reduce size from 5000px to 500px for example.
Best regards,
Alexey Prilovski.

Adobe Edge Animate CC image loading bug

hello,
The animation which i created in Adobe Edge Animate which is published for web, and when i load the main file in browser noticed that the images which i used inside the Edge Animate for animations are loading two times one with "edge.3.0.0.min.js:240" and "jquery-2.0.3.min.js:5", i hope this is a bug. how can i a avoided this multiple loading of same image files.

Hi, canpark-
We do not have a Korean localized version of Edge Animate, sorry!
-Elaine

Edge Animate CC 2014 issue with SVG - Images greater than 1024 x 1024

Hi, since i updated my Edge Animate CC for Edge Animate CC 2014 i have issues when i import .svg files. Edge told me "Images greater than 1024 may cause unexpected behavior on mobile device" when i import .svg files smaller than 1024 x 1024 ?
When i publish my animation i have a weird things happening and my image scaling default is 10% instead of 100% when i import. Someone had this issue ? Something we can do ? My images a less then 1024 x 1024 and work perfectly in Edge Animate CC 2.0

Ok. I've solved. I needed to load some things:
EC.Parallax.setup (sym);
The full code (that works for me) is:
-- compositionReady:
EC.Parallax.setup(sym);
// Load Edge Commons
yepnope({
load: [
"http://cdn.edgecommons.org/an/1.1.0/js/min/EdgeCommons.js",
// Load style sheet for the overlay
"http://cdn.edgecommons.org/an/1.1.0/css/style.css"
-- click
// Open image in spotlight overlay
// Set up configuration
var config = {
width: "1024",
height: "768",
type: "image",
source: "images/dog.jpg"
EC.Spotlight.open( config );
I hope to serve others.
Regards

Create an image scroller with swipe&drag in Edge Animate

Hi folks!
I'm trying to create a image scroller like this one http://www.awwwards.com/demo/touchSwipe-gallery-demo.html.
For the Swipe, I use the wonderful JQuery Plugin TouchSwipe http://labs.rampinteractive.co.uk/touchSwipe/demos/, but for the image sliding I would use the Adobe Edge Animate Timeline.
I know that I can use the Swipe events in Edge Animate to make start or reverse the timeline with pictures, but I would also make working an intermediate "dragging".
My problem, in fact, is: how can I make that - if I've only begun to swipe and I move the finger to left or right without releasing it - my timeline "drag" (or scrubs) frame by frame - like in the example above - until I release the finger?
Many thanks in advance!
Davide

Hi Elaine!
First, thanks for your prompt answer!
I read the link you gave me: in fact, I was aware - also thanks to Old Tim's posts - about how to create a "scrubber" in Edge Animate, starting from formulas like:
Translation = (positionOfScrubber/WidthOfScrubbing)*timeline;
My problem now is - I fear - more subtle: I can swipe left-right a set of pictures, I can "scrub" a timeline (using for example JqueryUI for the dragging), but I don't know how to put together the swiping and the dragging.
I would that - like in the example from my first post - if, e.g., I completed the swipe left, my timeline would play the animation that shows the pic moving to the left but, if I didn't complete the swiping and I begun dragging to the left, the animation would move with my dragging-finger (the "scrubbing")...
I know is very subtle, but it's how the gallery scrollers works on web and app in mobile devices...
Many thanks for your attention!
Davide

Adobe Muse with Edge Animate components plays great on the Mac but images don't show in Windows. Any suggestions?

I am using CC with both Edge Animate and Muse. After uploading to the website host it plays great on the Mac but images don't appear when I'm using Windows. Any suggestions?

Hi, VelveteenWebDesignGroup-
You're in luck! We just added in a feature to the latest version of Edge Animate CC (3.0) to enable the CDN option for OAM publish (what we call the "Animate Deployment Package"). This means that your Animate compositions can now references jQuery and the Animate runtime from the network instead of from the project directory. (Please note that this will only make sense for Dreamweaver and Muse integration with OAM and won't make sense for InDesign.)
To turn this on, launch Animate and go to File > Publish Settings. Then select the Animate Deployment Package on the left and click "Host runtime files on Adobe CDN." Save and publish, and you should be good to go.
Hope this helps,
-Elaine

Edge Animate command - not exporting images

I've installed the Edge Animate command extra for Fireworks and have a series of png's each in it's own state - set to 'include when exporting.'
When I use this extra (using any of the export options) either only one png is created or none are. All the other relevant html, edge and js files are created. Even an image folder is created, but no series of images. Therefore, my animation isn't exactly an animation with only one image.
What could I be doing wrong?

These images are all 404 not found on server:
http://www.ivanrowe.co.uk/images/lily.png
http://www.ivanrowe.co.uk/images/facebook.png
http://www.ivanrowe.co.uk/images/flower.png
http://www.ivanrowe.co.uk/images/grass.png
Try uploading your images folder again.
Nancy O.

In Edge Animate, how do I fade an image in on mouseover?

In Edge Animate, how do I fade an image in on mouseover?
Thanks!

You can either make a symbol and use a transition in Animate and use play() and playReverse() on mouseenter and mouseleave or you could use animate() on the element for our mouse events.
fadeout
sym.$("elementName").animate({"opacity":0.00},3000);
fadein
sym.$("elementName").animate({"opacity":1.00},3000);

Entre l'aperçu avec Edge Animate et l'aperçu du navigateur Internet Explorer il y a une différence chronologique d'apparition des images

Bonjour,
Entre l'aperçu avec Edge Animate et l'aperçu du navigateur Internet Explorer il y a une différence chronologique d'apparition des images ?
Je fais apparaître des images avec des flous après l'apparition de 3 images principales avec Edge Animate. Avec l'aperçu IE, ces photos apparaissent sans effet et en premier.
Merci pour votre aide.

Explorer est extrêmement défaillant dans la gestion des fonctionnalités avancées d'animation, de HTLM5 et autres transformations CSS.
Les floutages sont basés sur le filtres CSS et cela n'est pas étonnant que tu rencontres ce genre de pb. Si tout marche sur Chrome/Safari/Firefox/Oper ou mieux CSS3 Reference pour vérifier ce qui marche ou pas… c'est bien pratique; Quand à fabriquer un Fallback pour IE… quelle galère!

How do you add Edge Animate to HTML Module using DotNetNuke (DNN)?

First off I'm new to the whole web design/coding/html/css/jquery/etc., and the program Edge Animate is amazing!
I have a site up using DNN and wanted to put what I created on Animate onto one of the pages. I added an HTML module and that's where I'm stuck.
I do not know where to get the complete code so it works, and I do not know where to upload the Animate files. When it comes to creating the thing, I can manage (by reading ALOT), but when it comes to implamenting I am just stumped.
Any idea?
If you need more specific info just give the word, and I'll try my best.
Thanks,
Moses G.

There are four basic steps needed to embed an Edge Animate composition into an existing page:
Publish from Edge Animate. (This creates the necessary files to run the animation. Also, the code referenced in Step 2 and 3 below will be included in the .html file that Animate creates inside the publish/web folder, which you can just copy/paste.)
Add a <div> to the page that has the ID of Stage and the correct class name for your stage (i.e. the "Composition ID" for your project in Animate).
For example:
<div id="Stage" class="EDGE-1655086"></div>
Include the Preload .js file and the default style in your page's header, within Edge Runtime HTML comments.
For example:

<script type="text/javascript" charset="utf-8" src="test-1655086_edgePreload.js"></script>
<style>
.edgeLoad-EDGE-1655086 { display:none; }
</style>

Make sure to upload all of the include files to your server in the appropriate relative locations. This includes the _edge.js files, _edgeActions.js file, _edgePreload.js file, the edge_includes folder and its contents, any other files/folders created inside the "publish/web" folder when you publish from Edge Animate (e.g. "images" folder, etc.).
Here is a very simple example that will hopefully help to clarify:
http://thetraininggrounds.com/An-test/Insert-An-into-existing-page.html
As a reference, these are all of the files involved in the example:
An-test/Insert-An-into-existing-page.html (the existing HTML page)
An-test/ball-bouncing-banner_edge.js
An-test/ball-bouncing-banner_edgeActions.js
An-test/ball-bouncing-banner_edgePreload.js
An-test/edge_includes/edge.1.0.0.min.js
An-test/edge_includes/jquery.easing.1.3.js
An-test/edge_includes/jquery-1.7.1.min.js
An-test/edge_includes/json2_min.js
Thanks
Harshit yadav

Location of my images Edge Animate

Similar Messages

Maybe you are looking for