11 Replies Latest reply on Jun 19, 2015 5:59 PM by jackley923

    2 Edge animations in Iframes on the same page?





      I am sure this question has been asked before but searching the web and this forum I am still not sure of the answer. Its day 2 now  . . lol


      I have the code to imbed the animations here . .




      <div class="9promopanels">

      <div class="embed-container">

      <iframe src="http://myURLhere.co.uk/wp-content/dynamiccontent/promo%20box%202/9%20promo%20box.html" frameborder="0"></iframe>




      And the (responsive)CSS:


      .9promopanels {

      width: 100%;

      margin: 0px auto;




      .embed-container {

      height: auto;

      width: 100%;

      padding-bottom: 100%;

      overflow: hidden;

      position: relative;



      .embed-container iframe {

      width: 100%;

      height: 100%;

      position: absolute;

      top: 0;

      left: 0;



      Then for the next one I have again the same code, just different settings on the padding-bottom: 30% to set the height relative to the aspect ratio (as a percentage).




      Now then. Heres the tricky part! I need to get the two animations to run on the same page in the main content, just one further down the page. As it stands now there is a conflict on page, but I am not that great at Js!


      I am not the cleverest one out there, but am ok so I would appreciate a fairly simple explaination!!




      Thanks for the help!