Wrong Dimensions & Unwanted Gaps When Inserting Edge Animate Files In Dreamweaver

I wasn't quite sure which forum this belonged in, so my apologies in advance if anyone feels this should be in the Edge Animate forum instead.
I noticed when creating an animation in Edge Animate, when I publish it and try to add it within Dreamweaver, for some reason Dreamweaver is adding an extra 20 pixels to the width and the height. Also, since the Object tag used to embed it is Inline by default, it is also causing a small gap at the bottom of the animation between it and any blocks that come after it. Granted, I can go in and correct the dimensions in the code myself, and I can change the CSS on the Object tag to get rid of that gap. But what I'm confused about is why it is doing this - particularly with tacking an extra 20px onto the width and height, in the first place. Is there a setting somewhere to stop it from doing this? Below are screenshots of the animation in Edge Animate, where you can see the dimensions were 960x400, then a screenshot of Dreamweaver where you can see that it changed the dimensions to 980x420.

Your container has a width of 960px.
Your Edge has a width attribute in the HTML code of 980. Are you saying you didn't put that there?
By default, all browsers add their own margins & padding to HTML elements. It's customary practice for developers to zero out the default margins & padding with CSS.
You can use a global CSS reset or do it manually.
#block1, #block2, #block 3 {
margin:0 auto;
padding:0;
width: 960px;
Nancy O.

Similar Messages

Unable to Insert Adobe Edge Animate files into Dreamweaver CS6!

I have just tried the new Insert Edge Media feature in the new Cloud version of Dreamweaver CS6, but I can't get it to work!!
I have the option, but all the files in the Edge folder are unhighlighted (grey'd out) and I am unable to select anything Edge has published. I have noticed that the file extension has recently changed from .edge to .an with the launch of Animate.. Is this the problem?
Its a shame as its really quite tricky to put edge stuff into a web page at present..
Any ideas?
Wesley

Do you have an HTML5 web document open?
Below are instructions from the DW CS6 Reference document
http://helpx.adobe.com/pdf/dreamweaver_reference.pdf
Import Edge Animate compositions | Creative Cloud
This feature is available for Creative Cloud members and point product subscribers only.
You can import Adobe Edge Animate compositions (OAM files) into Dreamweaver. The composition is placed at the location of the cursor. Dreamweaver extracts the contents of the imported OAM file to a folder named edgeanimate assets. You can change the default location in the Site Setup dialog.
1. Ensure that your cursor is at the location where you want to insert the Edge Animate composition.
2. Select Insert > Media > Edge Animate Composition.
3. Navigate to the location in your computer containing the OAM file, and open it. The animation is placed at the specified location.
By default, the contents of the OAM file are extracted to the edgeanimate_assets folder. A sub folder with the name of the file is created. The contents of the OAM file are placed in the Assets folder under this location.
You can place Edge Animate Compositions into individual pages not part of any site. The files are extracted to the location of the page.
Location of extracted files
     A. The edgeanimate_assets folder
     B. The folder created using the file name of the OAM file
     C. The Assets folder containing the extracted files
4. Preview the inserted Edge Animate composition in a browser or in the Live View.
Change default location for extracted files
1. Open the Site Setup dialog for your site.
2. Under Advanced Settings, select Edge Animate Assets.
3. In Asset Folder, modify the location for extracted files
Nancy O.

Inserting edge animate files correctly into Dreamweaver

Hi there all,
I am loving edge animate! i have made all sorts of web banners and slideshows!! This is my problem, I have a project i would like to add to a 2 column layout in the right colum but eveytime i insert the project where i believe it should go it appears on the otherside of my screen not in the area i placed it or the containing div..
Can somebody please help me.. This is my code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <script type="text/javascript" charset="utf-8" src="publish/web/seal slider_edge.js"></script>
    <script type="text/javascript" charset="utf-8" src="publish/web/seal slider_edgeActions.js"></script>
    <script type="text/javascript" charset="utf-8" src="publish/web/seal slider_edgePreload.js"></script>
    <style>
        .edgeLoad-EDGE-90061968 { visibility:hidden; }
    </style>
<title>Seal Snorkeling</title>
<style type="text/css">

</style></head>
<body>
<div class="container">
<div class="header">
<div style="width: 100%">
<video controls="width: 987px">
<source src="seal.mov" type="video/mov" />
<source src="seal.mp4" type="video/mp4" />
</video>
</div></div>
<div class="sidebar1">
<img src="logo.jpg" width="470" height="216" align: "right"alt="logo" longdesc="logo.jpg" />
<p><strong>Seal Snorkeling </strong> in Cape Town is the ultimate wildlife experience for the adventurous. Plunge into the cool Atlantic ocean and swim with hundreds of playful Cape Fur Seals. Interact with them in their environment and on their terms. This half day excursion is for everyone and will be the highlight of your holiday.</p>
<p><strong>Meeting Times </strong> <br>9am - November to February.</br><br>10am - September to Ovtober $ March to April.</br><br>Please confirm when booking.</br><br>There are afternoon options if the morning is fully booked.</p>
    <p><strong>Meeting Location </strong> <br>We meet inside Hout Bay Harbout, outside the NSRI building.</br> See directions below</p>
    <p><strong>Trip Duration</strong> <br>3 hours. This includes kitting up, briefing and traveling to and from the island. On average, visitors spend an hour in the water.</p>
    <p><strong>What is provided?</strong> <br>We provide all equipment, a marine guide, boat ride, educational briefing, water, biscuits, hot chocolate and even a hot water shower to warm you up!</p>
<img src="divers.jpg" width="470" height="530" align: "right"alt="logo" longdesc="logo.jpg" />
     <div id="content">
    </div>
</div>
<div class="content" id="test"><div id="stage" class="EDGE-6752322">
    </div></div>
<div class="footer">
    <p></p>
</div>
</div>
</body>
</html>
If anyone has some advice i would be very grateful, Thanks in advance!!
Nick

Hi there,
Here is a pic of what im talking about, as you can see the edge file is now hovering over the entire project again.. didnt change a thing and now back to artifacts even after restarting please please please help

Getting an unwanted line when adding a swf file to dreamweaver and previewing it in the browser...

I created a very simple swf with a box moving from stage right onto the stage. It works fine when previewing the swf itself, but when previewing from dreamweaver there is a small line that only extends half way across the swf file (which happens to be the length of the box). I even made the box smaller than the stage but the line still appears at the bottom.

Sometimes it helps to create a box in the background color that overlaps the edge of the stage. I had the same problem with a .swf that had a black background. The web page had a black background too but there was a white line at the bottom of the .swf when I previewed it in the browser. I added a black box to the background that went past the bottom of the stage and into the surrounding area and resaved it. The white line disappeared.

Insert Edge Animate Compositions Unavailable

I don't have an option to import Edge Animate Compostitions in Dreamweaver's 'Insert' menu.
Was this an update to CS6 only available in the cloud and not to boxed versions?
I have CS6 master collection. DW 12.0 Build 5861 for Windows.

This feature of inserting Edge compositions directly into DW is available only to Creative Cloud subscribers (at the moment, since Creative Cloud brings in all the new features as soon as they're released). See here: http://helpx.adobe.com/dreamweaver/using/import-edge-files.html
However, you can manually insert your Edge compositions into your code with a div tag and a unique Identifier to the div, also adding a few supporting Edge files. You should publish your Edge composition for 'Web'. You can possibly decode the published index.html file source code after that. If you need more help doing this, do post back!
-ST

Edge Animate code into Dreamweaver jquery mobile theme?

I am having trouble getting my Edge Animate file to work on my Dreamweaver jquery mobile theme web site. I was told to get the code from my animate file and put it in my dreamweaver web site. Kind of like this.....copy the Edge runtime code, paste in web site under <head>. Then copy div stage code, and paste it in my website under the content div. I just cant seem to get it to work. It shows up blank.

Ok, i got it. I was making this a lot harder then it needed to be. If anyone else has this problem, you just publish your project when in Adobe Edge Animate, then save in the folder you are using for your website. Then in Dreamweaver you can go to insert media, find the file and insert it. All is well.

I am getting a slider on horizontal and vertical sides while embedding the edge animate object in dreamweaver CC 2014

I am getting a slider on horizontal and vertical sides while embedding the edge animate object in dreamweaver CC 2014.
When I import the ".oam" file in dreamweaver and change its width and height, then it starts showing me horizontal and vertical sliders.

Hello!
I now have a project that seems to be corrupted. A had been working on it all morning, with a few bugs here and there. Now I can no longer open the file, receiving this error: "Edge Animate: Exception An error occurred. Please your work and restart Edge Animate."
I will try to attach sample files.
- J Sean

There is suppsoed to be an option to import Edge Animate objects into Dreamweaver. I have the latest

There is suppsoed to be an option to import Edge Animate objects into Dreamweaver. I have the latest version and I do not see that option.
Windows 8.
DW CS6
12.0 5808
http://helpx.adobe.com/dreamweaver/using/import-edge-files.html
http://layersmagazine.com/edge-animations-into-dreamweaver-cs6.html
And I am a member of creative cloud

Reading another post... here's what I had to do. Log into creative Cloud. >> Re-Download Edge >> It installs over the top of the existing Edge Animate install >> Then close everything >> go back into Creative Cloud >> Now it shows that Dreamweaver has an update. >> So I download the latest Dreamweaver>> Bam!
My guess is there is no reason to have the DW 12.2 if the system doesn't think you have the latest Edge Animate.
Silly.
Thanks again.

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.

Error when starting Edge Animate

Need help. Everytime when i start Edge Animate it shows me following error:
"the requested url/welcome_to_project_edge/WelcomeToEdge.html was not found on this server"
Chromodoris/0.86.412.230
What can I do?
Greetz from Germany

I spent 1.5 hours on the phone with Adobe Tech today. The steps he took:
Reinstalled Creative Cloud
Ran Adobe Cleaner
Reinstalled Edge Animate
Cleared my Temp and Prefetch folders (I had a lot there)
None of this worked and the problem has been escalated... however.... after
I got off the phone I uninstalled the Giraffic program mentioned in this
thread and everything now works!
So if anyone else gets this problem my feeling is that probably having too
much data in my Temp and/or Prefetch folder caused the problem, but the
Giraffic thing also contributed. For me I only installed Giraffic to try
and solve the problem so it didn't cause it, but it did prevent other
maintenance steps from working.
If Adobe reads this I don't need an escalation anymore!
On Mon, Oct 28, 2013 at 9:28 AM, Gary Hilson <

How to insert Edge animate in current web html page

Just downloaded Edge Animate and trying to include animation.html in current website.html page using Adobe Edge Code preview but am not sure how to go about it not being a hard core programmer.... am i being too ambitious?

Thanks here is the code :
Animation code : in subdiretory off Root directory : AdobeEdge/Bannerad.html
<!DOCTYPE html>
<html>
<head>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
          <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=IE8"/>
          <title>Untitled</title>

    <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>

</head>
<body style="margin:0;padding:0;">
          <div id="Stage" class="EDGE-160548878">
          </div>
</body>
</html>
And segement of Accomodation.html page in root directory :
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="Generator" content="iWeb 2.0.4" />
    <meta name="iWeb-Build" content="local-build-20130308" />
    <meta name="viewport" content="width=700" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
          <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=IE8"/>
          <title>Untitled</title>
    <title>Accomodation</title>
    <link rel="stylesheet" type="text/css" media="screen,print" href="Accomodation_files/Accomodation.css" />
    <style type="text/css">
/*<![CDATA[*/
          @import "Scripts/Widgets/HTMLRegion/Paste.css";
/*]]>*/
</style>
    
    <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="AdobeEdge/Bannerad_edgePreload.js"></script>
    <style>
        .edgeLoad-EDGE-160548878 { visibility:hidden; }
    </style>

    <script type="text/javascript" src="Scripts/iWebSite.js"></script>
    <script type="text/javascript" src="Scripts/Widgets/SharedResources/WidgetCommon.js"></script>
    <script type="text/javascript" src="Scripts/Widgets/Navbar/navbar.js"></script>
    <script type="text/javascript" src="Scripts/iWebImage.js"></script>
    <script type="text/javascript" src="Scripts/Widgets/HTMLRegion/Paste.js"></script>
    <script type="text/javascript" src="Accomodation_files/Accomodation.js"></script>
</head>
<body style="background: #000000; margin: 0pt; " onload="onPageLoad();" onunload="onPageUnload();">
    <div style="text-align: center; ">
      <div style="margin-bottom: 0px; margin-left: auto; margin-right: auto; margin-top: 0px; overflow: hidden; position: relative; word-wrap: break-word; background: #fffde8; text-align: left; width: 700px; " id="body_content">
        <div style="margin-left: 0px; position: relative; width: 700px; z-index: 0; " id="nav_layer">
          <div style="height: 0px; line-height: 0px; " class="bumper"> </div>
          <div id="id1" style="height: 258px; left: 17px; position: absolute; top: 13px; width: 665px; z-index: 1; " class="style_SkipStroke">
            <div class="text-content graphic_shape_layout_style_default_External_665_258" style="padding: 0px; ">
              <div class="graphic_shape_layout_style_default"></div>
            </div> <p style="margin:0;padding:0;">
                     <div id="Stage" class="EDGE-160548878">
                         </div>
.................... etc.
thanks.

Edge Animate files (.oam) won't open on Mac

I have a Muse template I purchased with Edge animations, and I have Edge Animate CC installed, but the files fail to successfully open in Edge Animate CC on my computer when I try to open or edit them. When I first tried to open the files, they weren't associated with any application, so I associated them with Edge Animate. Now if I try to open one of then it will open Edge, but the files will not open. The program opens, but the files don't. They also don't open from within the program itself. In the Finder, the File Info dialog box lists Kind as Adobe Edge Animate CC 2014.1 Document. In the preview section of the file info box it doesn't show the nice icon, it shows the Mac's plain exec icon. In the Finder, it shows the nice Adobe OAM preview with the "M" shape drawn out in paths.
I am running OS X Yosemite, 10.10.2 on an iMac Retina (Late 2014).
Steps I have tried so far:
I have uninstalled Adobe Edge Animate CC, then reinstalled
I have restarted the computer
I have repaired disk permissions
I have attempted to open with Dreamweaver (program opens, but file doesn't)
I have inspected the contents in a text editor. xml document within contains the comment: CDATA[Widget Exported from Adobe Edge]
Anybody have any ideas why I am running into problems opening the files? Thanks in advance.

I have learned that I don't need to open the .oam files, there are .an files elsewhere I need to open. I will mark my own question answered in this case.

Responsive scaling of Edge Animate composition in Dreamweaver Fluid Grid Layout

I have created an animation in Edge Animate and have placed it in the header of a Dreamweaver Fluid Grid Layout. I have put it in a div by itself so it can be turned off in the mobile layout. When I test the layout in a browser, the Edge Animate composition scales responsively to the window size, but the height of the div it is in does not. The width of the div changes with the width of the window, but the height of the div remains the same. Because the height of the div doesn't change, as the animation responds and resizes it leaves a large empty space between the bottom of the animation and the content that follows it on the page.
The div itself does not have a rule for it's height associated with it. It seems to me that the div is getting its height from the original size of the html object which is the animation. I tried removing the height rule for the object, but then the div clips the bottom of the animation, and again, it doesn't resize with the window.
Is there a way I can get the div's height to resize with the size of the animation as it changes?

Thanks for your reply. You're right about most people not resizing their viewport during a session, but unfortunately the problem exists whether the screen is being resized or not. Refreshing the screen doesn't solve the problem.
The width of the div adjusts to the width of the screen as expected and the Edge Animate composition inside it does too, but the height of the div doesn't adjust. As the animation gets smaller to fit the width, the height of the div that contains it remains the same, leaving empty space at the bottom of the div. What is needed is for the div to scale to fit the page width proportionally. Instead, only the width is adjusting.
So I guess I need to know if there's either a way to force the div to scale proportionally or a way to tell it to adjust to the animation that it contains.

Corrupted text when inserting another PDF file.

Hi all,
Currently using Acrobat Pro 11.0.10.
When inserting a page or multiple pages (all PDF) into an existing PDF file, the text becomes corrupted with the new pages.
I can edit the text and change it from Arial to another font and back to Arial to restore the text to how it should be, but when doing multiple files every day it becomes very time consuming.
Below is a shot of what is generated when compiling the files.
I'm really hoping that someone can help me as this is driving me nuts.
Thanks in advance,
Dean.

Hi Dean O'Neill and Karina Stavenes,
In order to replicate the issue in-house, we would be needing the files. Could you send the original files as well as the combined files so that we can investigate further? You could compress the files to a zip and upload it to the following link -> Acrobat Issues.
Also, sending in the exact steps to reproduce the issue would be helpful.
Thanks.

How make adobe edge animate file full screen in adobe muse?

I have created a responsive webstie so far and i want the edge animation i created in edge to be fullscreen in muse... I made it to resize in edge but in muse i scalled it to the whole size of my website and in preview it looks off and in browser it looks off and small. can anyone tell me how to make the edge animate slideshow i created fullscreen in muse? would it be better to import the html as a iframe object and right the code for it to be resized

Well, I'm not sure how you went about it, but the way I did it was as follows:
I looked at the width and min height of my page in Muse, and made a canvas in Edge Animate of that exact size. I think it was like 960 px by 500 px. Can you show us an example?

Wrong Dimensions & Unwanted Gaps When Inserting Edge Animate Files In Dreamweaver

Similar Messages

Maybe you are looking for