7 Replies Latest reply on Oct 3, 2014 2:49 AM by dajupe

    Edge Animate pushing lower DIVs down on page.

    dajupe Level 1

      Hello.

      When I make my Edge Animate animation responsive, (and placed in dreamweaver) when looking in a browser it pushes all the divs under it down the page, leaving an unsightly gap underneath. As I scale the page down, the gap in between my animation and lower divs becomes further pronounced making the page unsightly and unfortunately I cannot use the animation. It happens when I have an animation where the width is like 960 pixels and height around 300 pixels. I have followed all of the steps correctly. I have tried all sorts of work arounds with no success.

      It has been quite some time since I first run into this problem. In which time I have had to pluck some of the lovely flowers I had created for my site, due to this very frustrating problem. I am about to start a new site and I am hoping for the love of god that someone has found a solution to this very very frustrating problem. Apart from this I find Edge Animate to be a fantastic program. I have seen many other people who are having the same problem with no solution at hand. Thanks for your time, I hope to hear an answer from someone soon

        • 1. Re: Edge Animate pushing lower DIVs down on page.
          vivekuma Adobe Employee

          Can you please share the comp, so that we can take a closer look at the issue?

          • 2. Re: Edge Animate pushing lower DIVs down on page.
            dajupe Level 1

            Did you just want the HTML? Below is an example of some simple HTML that recreates the problem in dreamweaver. Below that is the Edge Animate HTML.   The other thing is the comps always come into Dreamweaver 20 pixels larger in height and width than what I make them in Edge Animate. The sample below has been trimmed to the right dimensions (it came into dw at 980 x 220).

            When you resize the window you will see that there is a large gap being created between the sample animation and lower div.

            Thanks for getting back .

            DREAMWEAVER HTML

             

            <!doctype html>

            <!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->

            <!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->

            <!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->

            <!--[if gt IE 8]><!-->

            <html class="">

            <!--<![endif]-->

            <head>

            <meta charset="utf-8">

            <meta name="viewport" content="width=device-width, initial-scale=1">

            <title>Untitled Document</title>

            <link href="boilerplate.css" rel="stylesheet" type="text/css">

            <link href="fluid.css" rel="stylesheet" type="text/css">

            <link href="styles.css" rel="stylesheet" type="text/css">

            <!--

            To learn more about the conditional comments around the html tags at the top of the file:

            paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

             

             

            Do the following if you're using your customized build of modernizr (http://www.modernizr.com/):

            * insert the link to your js here

            * remove the link below to the html5shiv

            * add the "no-js" class to the html tags at the top

            * you can also remove the link to respond.min.js if you included the MQ Polyfill in your modernizr build

            -->

            <!--[if lt IE 9]>

            <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

            <![endif]-->

            <script src="respond.min.js"></script>

            </head>

            <body>

            <div class="gridContainer clearfix">

              <div class="fluid animation">

                <object id="EdgeID" type="text/html" width="960" height="200" data-dw-widget="Edge" data="edgeanimate_assets/responsive_test1/Assets/responsive_test1.html">

                </object>

              </div>

            <div id="underDiv" class="fluid">This is the content for Layout Div Tag "underDiv"</div></div>

            </body>

            </html>

             

            EDGE ANIMATE 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"/>

              <title>Untitled</title>

            <!--Adobe Edge Runtime-->

                <meta http-equiv="X-UA-Compatible" content="IE=Edge">

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

                <style>

                    .edgeLoad-EDGE-26670740 { visibility:hidden; }

                </style>

            <!--Adobe Edge Runtime End-->

             

             

            </head>

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

              <div id="Stage" class="EDGE-26670740">

              </div>

            </body>

            </html>

            • 3. Re: Edge Animate pushing lower DIVs down on page.
              vivekuma Adobe Employee

              Can you specify the version of Edge Animate and Dreamweaver you are using?

              • 4. Re: Edge Animate pushing lower DIVs down on page.
                dajupe Level 1

                I am using Edge Animate cc 2014 and Dreamweaver cc 2014.

                • 5. Re: Edge Animate pushing lower DIVs down on page.
                  vivekuma Adobe Employee

                  Ok. This seems to be a known issue when oam is inserted in dreamweaver using <object> tag, when responsive scaling is set in Edge Animate.

                   

                  This issue has been addressed in the upcoming releases of Edge Animate and Dreamweaver, which will be available soon this month.

                  1 person found this helpful
                  • 6. Re: Edge Animate pushing lower DIVs down on page.
                    dajupe Level 1

                    All right finally an answer! Thanks for getting back I hope it is addressed soon as I am starting a new website and I want to use responsive animation in it. Thanks for your time.

                    • 7. Re: Edge Animate pushing lower DIVs down on page.
                      dajupe Level 1

                      How do I mark as helpful? lol

                      I would have liked the answer but I don't! However I am very thankful for your time and your help. Cheers vivekuma