1 Reply Latest reply on Nov 29, 2012 8:36 AM by DaigoFuji

    Best method to Embed Edge Animation in Dreamweaver page? Animation height not filling container?

    _lsmith_

      HELP!!!...

       

      I have created a responsive Edge animation (simple image transistions). The only way I have managed to embed it into a Dreamweaver page is as an Object or iFrame using the edge .html file. Works great with a fixed height and width. However in my responsive, fluid grid layout the height is not responsive. Tried height "100%" and height "auto" to no avail. I am pulling my hair out over this and am hoping you can offer a simple solution. 

       

      This is how my stripped down code is:

       

      <head>

      <!--Adobe Edge Runtime-->

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

      <style>

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

      </style>

      <!--Adobe Edge Runtime End-->

      </head>

       

      <body>

      <div id="banner"><div id="stage" class="EDGE-banner">

      </div>

      </div>

      </body>

       

      WITH THESE DIV TAGS NOTHING APPEARS ON THE PAGE WHATSOEVER, so I added the object div like this:

       

      <div id="banner"><object data="animation/banner.html" width="100%" height="auto"><div id="stage" class="EDGE-banner">

      </div></object>

      </div>

       

      Now the animation at least displays but the height is not responsive.  The image remains scaled but does not fill/expand container vertically. The bottom of the animation is completely cropped off until I size down the browser window. It then progressively shows white space beneath the animation as it scales down rather than filling the #banner div area.  Static images scale fine.  It is just this dang animation that's causing problems.  Perhaps it lies with the Object tag?  Same issue occurs with iFrame.

       

      I would like to know the MATTER OF FACT way to embed an Edge Animation in an existing web page!!!  Too many forums with different ideas.  Should there be a simple instruction?  I used what I found to be closest solution.  There has got to be a better way.  Or perhaps this is a kink that still needs to be ironed out and Adobe Edge Animation is not quite ready to be incorporated into Responsive design?  Or Responsive design is not quite ready to be deployed?

       

      Is there an expert who can help?  Thanks for your time!