Insertion of files Adobe Edge in my html page

Hi all

I have an urgent problem of inserting a series of animations that I created in Adobe Edge in my portfolio website.

I have 6 files to insert, which form a series of short animations.

When I publish each file "adobe" edge, I understand that you must insert the Adobe Edge enforcement code in the head section and Edge Class code in the body section.

What I'm not clear, this is where I save html, edge.js and edgeActions.js files. Should it be stored in the main folder where is saved the index.html file?

And where images must be saved?

If I try to move these files into subfolders, which seem to make sense to me, the animation does not work.

What I leave me puzzled, you also need to record a 'edge.5.0.1.min.js' and a ' jquery-file 2.0.3.min.js in my javascript file. But whenever I publish an edge file, I need to save these files with the same name. And I don't know where these files must be saved.

Hope I'm making sense here. I'm new to web development, and I hope I can show these animations on my portfolio website.

Did someone met with these problems when you attempt to insert adobe edge files in an html page?

Thank you

S

When you publish your animated project of edge, go to the "published" folder and extract all the files in the following folder titled 'web' and place them (as they are) in the folder corresponding to your index.html file. Once you add running Adobe Edge code animate the animation to your index.html file should be responsible. Don't forget that the edge file is already linked to image and js files in the exact form they appear after the opening of the "web" folder Thus any movement of files without taking into account other will break the link. For example: you can not put the .js to another folder after publication file because the file html for your project is related to the .js file exactly where he was when the publication was made. So he'll keep looking for this file in this location unless otherwise stated.

An example of how you can organize your files: when you open your Web folder, it should be arranged something like this

  • -Images
  • -example.js
  • -exampleproject - edge.html

Once the files are placed in the location of the index file we set something like:

  • -Images
  • -example.js
  • HTML - exampleproject-edge (NOTE: this html file becomes irrelevant, after adding the runtime code in the index file)
  • -index.html

Once this is done, you can add your other projects as well. You will have to manually put all images used for each project in a single "record"of the images. "

I hope this helps clarify things a bit!

Tags: Edge Animate

Similar Questions

  • When I insert my file "adobe" edge oam animate in must I get a rectangular white flash at the head of the animation

    When I insert my file "adobe" edge oam animate in must get a rectangular white flash at the head of the animation?

    Hello

    I would appreciate if you could share the screenshots of the Design view and mode of preview for better understanding of the issue.

    You can also create a temp BC to us URL.

    Concerning

    Vivek

  • Move a file Adobe Edge JS Inline HTML?

    I'm having a problem trying to reconcile demand for a provider for files for the banners of HTML5.

    The biggest concern is that they want all the relevant JS code to be hardcoded in the. HTML file. I know the edition process takes care of the connection, but now I'm stuck with trying to extract this code and put everything back together in the HTML file. I get error undefined, that makes sense.

    The issue becomes a question of where to place the inline JS and how I calling?

    The AdobeEdge.loadComposition method calls the js file, but if everything is online, otherwise how can I refactor this?

    Welcome to my nightmare lol.

    Ryan

    see if these links are useful incorporating the edge animate Js, and image files

  • InContext editor works not with custom html/css (animate files adobe edge)

    Hello

    I just created a site of catalyst for business and I chose for my own HTML/CSS/JS site (without a template). The site is made with Adobe Edge animate and the files are already uploaded to the server.

    When I connect to the admin of the catalyst business account I can see my site works but now I would like to use the incontext Editor. When I hit the edit button I see my site, but I can't change.

    In my index.html file I insert scripts like 'ice:editable="html"' and 'ice:editable="*". But still the incontext editor doesn't work.

    Example:

    <div ice-editable="html" id="Stage_UIHE-Cover_cover-title-03"><p ice-editable="html" style="margin: 0px; line-height: 36px;"><span style="font-family: times_new_romanregular, sans-serif; font-size: 40px; color: rgb(255, 255, 255);">Nepal Earthquake Aftermath:</span></p>

    I'm doing this right? Could someone help me how to insert the tags in the right way.

    Or maybe it is not possible to get the incontext Editor to work with the Edge files animate.

    I hope someone can give me some answers and point me in the right direction.

    Thank you!

    As much as I know to Edge host sites work the script must be initialized. ICE but does not play nice with dynamic content and that's why he doesn't work for this particular site.

    Don't think that there is a way around this.

    Thank you

    Mihai

  • You can detach a file Adobe Edge animate scrolling effects once the animation finished?

    In Adobe Muse, I started playing with the effects of roll with the Adobe Edge Animation OAM files. I can get to animate while scrolling pretty easily, but I'm wanting the animation to stop the playback and pin it on the page, then it will continue to scroll the page as usual.

    The idea is so that I can add several animations on a page that scroll you, finishing, then do scroll to the next animation.

    You can do this in Adobe Muse? I go about it the wrong way? Is there an easy way to scroll animation with jQuery HTML5?

    I am wanting to make a way to make a page like this one - https://vimeo.com/cameo

    After watching and communicating with help from Adobe, it is confirmed that this can be done in Adobe Muse ("once it is pinned, you cannot detach it"). Looks like I was looking for an easy way to code complex animations...

    The solution is to do it manually. Waypoints / Jquery.

    A useful link is https://elikirk.com/canvas-based-scroll-controlled-backgroud-video-use-parallax-style-web-design/ I think it is in the right direction. If I find myself always this coding, I'll let you know.

  • Adobe Edge animation glitching html and SVG page in the process of disappearance

    Hi all

    I'm having a problem with Adobe Edge animation that I do for a customer - I'm pretty new on board, so this may be an easy solution!

    There is a SVG named chassis (it looks like a Brown tadpole) that disappears in the middle of the animation - and glitches then the Web page by drawing a white background that spans all...

    I put the border for transparent background so I don't know why this is happening, it happens even in "Preview in browser" option.

    Here is the site where the animation is incorporated - http://louisreed.co.uk/tiddlybot (down a bit)

    For any help or suggestion welcome.

    Thank you!

    Louis

    Hi Louis,.

    We are aware of this problem and it happens on Chrome only. This issue is followed internally. Thanks for reporting this.

    Kind regards

    Soline

  • two animations of edge on an html page

    Hello

    I followed the tutorial adobe to manually create an html page in order to have two animations of edge on a page, but it does not work well.

    The second animation starts but not the first (I can see the first image only).

    Here is my code:

    If I move the second div block to the top of the page (animations), the second animation starts but not the first.

    There is no javascript error in the browser console.

    Could someone help me?

    Thank you in advance,

    Olivier

    The problem is resolved.

    See discussion: Re: problem view animation of edge in a publication page several to edge host

  • How to insert more than one animation in an html page?

    Hello

    How to adapt the code (< script >, html tags function) in the html code generate AnimateCC to insert several documents of canvas in the same page?

    Thanks for your replies.

    Bertrand

    The easiest way is to sandbox every animation in its own iframe, but apparently it is also possible by digging the published HTML and rename some variables root while they are in conflict with each other.

  • How to reduce the size of a file Adobe Edge animate?

    I'm trying to get the zipped file size up to 150 kb or less, and the closest I can get is 439 kb. I tried the following until now:

    • delete unnecessary files before publishing
    • toggled active .png for lower quality .jpg assets where I can
    • published using the "Host on Adobe CDN runtime files" - I read that it can reduce the size of the file of 80%

    I'm pretty new to the software, and there is certainly a chance that I do not have something good. You can view the file here if you are interested in taking a look. If anyone has any suggestions, I would appreciate your insight!

    Thank you

    Cassie

    Yes, I did! First of all that I have lived and made sure I had my images at the smallest possible file size. Then, after the publication in the destination folder, I went in the 'images' folder and deleted the file "thumbs.db" Edge is automatically created. Makes a HUGE difference in the size of the file! Hope that works for you too!

  • Is it possible to integrate a file adobe Edge animate on a Twitt?

    If not possible what are the alternatives?

    Hi, Pedro.

    Because the tweets are 140-character length of plain text, you will not be able to incorporate an Animation in a tweet.  You can, however, embed a URL in a tweet, then you want to go this route.  Hope that helps!

    -Elaine

  • Insertion of files of two Quicktime on a page?

    I have try it on this page:

    http://www.makingfilmhistory.com/Muybridge.html

    to insert Quicktime 2 files, each value "autostart = false". Both appear with Autostart off, but one or the other fails to display the first frame of his film, creating what appears as a black above the progress bar space until it clicks in this area.

    How can I fix this so that each track photo appears when loading the page?

    Thanks for your help.

    Professor Bob

    You can set a picture poster in QT itself (QT Pro required) and it should appear. He is still not guaranteed and may work differently on other systems based on performance and how the necessary routines are initialized. For example, I can see two videos without problem. Therefore, your best bet is to integrate the QTs with JavaScript and use a JPG placeholder, while it loads. Similarly, with the help of Flash Video instead of QT can avoid problems or would allow you to use still images as placeholders...

    Mylenium

  • Adding an animation of html Adobe Edge to a page in DW5

    I created a sliced from Photoshop .psd file. Where I would normally have a slice for a Flash movie, but now I want to insert an animation in Adobe Edge. The html page I need edge animation to display has tables and the Edge file must be placed here

    < td colspan = "9" >

    "< img id ="EDGE"src ="Images/EDGE.png"width ="980"height ="625"alt =" "/ > < table >

    < /tr >

    But the page html with the animation of the edge is encoded as follows:

    < ! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional / / IN" "http://www.w3.org/TR/html4/loose.dtd" > ""

    < html >

    < head >

    < meta http-equiv = "Content-Type" content = text/html"; Charset = UTF-8 ">"

    < title > DASHBOARD FIRST TEST < /title >

    <! - execution of adobe Edge - >

    "< script type =" text/javascript"src="edge_includes/jquery-1.6.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.3.min.js "> < / script >

    "< script type =" text/javascript"src="edge_includes/edge.symbol.0.1.3.min.js "> < / script >

    < script type = "text/javascript" charset = "utf - 8" src = "EdgeTest_edge.js" > < / script > "."

    < script type = "text/javascript" charset = "utf - 8" src = "EdgeTest_edgeActions.js" > < / script > "."

    < link rel = "stylesheet" href = "EdgeTest_edge.css" / > "

    <! - end of Runtime adobe Edge - >

    < / head >

    < body >

    < body style = "margin: 0;" padding: 0; ">

    < div id = 'stage' class = "EDGE-23948639" >

    < / body >

    < / html >

    In order to take the entertainment on board and add it to the html page with tables just copy the javascript code of the page edge to the header of the new html that I want to put animation on board?

    and then instead of the

    < td colspan = "9" >

    "< img id ="EDGE"src ="Images/EDGE.png"width ="980"height ="625"alt =" "/ > < table >

    < /tr >

    replace the < img id from the top and replace it with

    < div id = 'stage' class = "EDGE-23948639" >

    ??


    Sorry to be a little anal about what I tried this and it worked by exchanging on the

  • Insert the file numbers

    How can I insert a file of numbers in my document pages? I tried to copy and paste, but the numbers file exceeds a single document page and document only adds a new page.

    Pages V5.6.2 only will allow you to insert PDF and image files supported.

    Select the cells of v3.6.2 of numbers that you want to appear in v5.6.2 Pages and then copy the selection to the Clipboard. Open Preview, then choose in the menu file: new from the Clipboard. You now have a PDF file that is not registered in the preview. You can then save the PDF file, and then drag and drop it into Pages, or copy the content of the PDF preview to the Clipboard and then paste them into Pages (in PDF).

    Once you have a PDF of your selection of worksheet Numbers in Pages v5.6.2, representation you can select the tab reorder and click the original size, scale and then rotate 90 degrees to fit the provision in the Portrait.

    If numbers v3.6.2 selection can be inserted in the layout of the portrait of Pages, and then select the cells in numbers, copy and paste in the Pages are possible. When you do so, Pages presents a menu of additional editing: entry of paste formula which is preferred over other results paste options when you want to keep the formulas. Pages won't allow rotation of the selected tables.

  • Swf object Center on my index.template.html page

    Simple question is, how do I Center my swf file on my index.template.html page? One of my css definitions do not work. Do I have to use the basic html table element or what?. I also need to set the background image for my <>application but definition background-repeat will not work.

    It's not what I'm looking for: http://cookbooks.adobe.com/post_How_to_horizontally_center_a_Flex_application_in_a-11467.h tml

    Untitled.png

    I downloaded and extracted the zip, run main html in IE 8.0 - see attached... works like a charm

  • How to import Adobe Edge host files in Adobe animate (formerly Flash CC)

    Is it possible to import Adobe Edge animated files in Adobe animate?

    Animate Adobe took over and it seems to animate Edge will be is no longer supported. However Adobe animate cannot import html, oam, or all those files that it creates. Edge Animate can as well export and import these files, but Adobe host seems to be incapable of managing this process. Is it possible to import files such as html, oam, or on files in Adobe animate? Or must all be rebuilt from scratch?

    You can not.  The new Adobe Animate is the updated Flash version; Animate edge was a completely different software.

Maybe you are looking for

  • Remove corrupt index '$I30' file 0 x 5 (.). ???

    Hello I can't a lire participation from my hard drive with this message delete corrupt index '$I30' file 0 x 5 (.). ???

  • How to escalate a case in the USA?

    I have dealt with MS India for weeks on a windows update problem. They're constantly missing call time, I asked that a supervisor call me - they do not have. The system is much worse today than when I called through their work - I have never the same

  • Capture of CC - CC Photoshop compatibility

    Hola,normal is as motivated came los con el creador motivated to Capture no CC no sean compatible con Photoshop?He created motivated desde el iPad con Adobe Capture pero yo me appears in Mi Biblioteca en el mi como elementos Mac desktop Photoshop no

  • laptop camera?

    The computer that I am wrrting on is: product name: HP Pavilion dm4, laptop, product number: XZ298UA #ABA {deleted personal information}, Windows 7 Home Premium 64 - bit Service Pack 1. The question I have is when I got to the laptop, there is a big

  • Why my reading of mercury stop working with graphics Nvidia GeForce GTX580?

    Hi, anyone experienced a malfunction like this:My stop playback of mercury with a Nvidia GeForce GTX580 graphics card,It worked perfectly well, after 2 months doesn't work is not on the system (windows 7 ultimate 64-bit) 16 GB ram Intel Core 2 Quad C