6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

How To Load A iFrame Inside A Page?

by taskemann
5 replies
Hi,

When I add this aStore iFrame to my page (in the page's HTML editor):


<iframe src="http://astore.amazon.com/MYTRACKINGID-20" width="90%" height="4000" frameborder="0" scrolling="no"></iframe>
The page get 4000px high, but the content in the iFrame isn't always 4000px high so I often get a lot of empty space on the bottom of the page. Something that's very ugly for my users.

Is it possible to make the iFrame load inside the page so the page's height always is the same height as the content that the iFrame shows?


Thanks,

Jimmy
#iframe #inside #load #page
  • Profile picture of the author Brandon Tanner
    Originally Posted by taskemann View Post

    Is it possible to make the iFrame load inside the page so the page's height always is the same height as the content that the iFrame shows?
    If the contents of the iFrame were on the same domain, then you could easily do that with a little bit of Javascript. But since the contents of the iFrame are on a different domain, then as far as I know, it's simply not possible (due to cross-domain security reasons).
    Signature

    {{ DiscussionBoard.errors[7319905].message }}
    • Profile picture of the author taskemann
      Originally Posted by Brandon Tanner View Post

      If the contents of the iFrame were on the same domain, then you could easily do that with a little bit of Javascript. But since the contents of the iFrame are on a different domain, then as far as I know, it's simply not possible (due to cross-domain security reasons).
      Hm.. According to this: javascript - Resizing an iframe based on content - Stack Overflow it should be possible. But it's to damn complicated for me :p
      {{ DiscussionBoard.errors[7322685].message }}
      • Profile picture of the author Mkj
        If you want an amazon store that isn't based on an iframe check this script out:

        Associate-O-Matic
        {{ DiscussionBoard.errors[7323059].message }}
      • Profile picture of the author Brandon Tanner
        Originally Posted by taskemann View Post

        Hm.. According to this: javascript - Resizing an iframe based on content - Stack Overflow it should be possible. But it's to damn complicated for me :p
        The first answer on that page requires you to have access to both domains. And all of the other answers are either not cross-domain compatible, or don't work with all browsers.

        Something I just thought of though... one alternative to using an iframe would be to use PHP file_get_contents (or CURL) to grab the HTML from the external page, and then display it on your page inside of a div with a fluid height. And if the external page uses relative paths for the CSS files, Javascript files, images, etc, then you would have to figure out the absolute paths for all of those files, and account for that in your code.

        One caveat though.... I'm not sure if doing that would be a good idea from a legal perspective, because you would basically be grabbing all of the content on their page, and actually copying it to your page (which is entirely different than simply "framing" it). So there may be some copyright or hotlinking issues if you go that route. Best to contact them first and ask if they would be OK with that.

        If you're not comfortable with PHP though, then you probably wouldn't want to attempt this anyways. But, I just thought I'd throw it out there as another possible option.
        Signature

        {{ DiscussionBoard.errors[7323475].message }}
        • Profile picture of the author taskemann
          Originally Posted by Brandon Tanner View Post

          The first answer on that page requires you to have access to both domains. And all of the other answers are either not cross-domain compatible, or don't work with all browsers.

          Something I just thought of though... one alternative to using an iframe would be to use PHP file_get_contents (or CURL) to grab the HTML from the external page, and then display it on your page inside of a div with a fluid height. And if the external page uses relative paths for the CSS files, Javascript files, images, etc, then you would have to figure out the absolute paths for all of those files, and account for that in your code.

          One caveat though.... I'm not sure if doing that would be a good idea from a legal perspective, because you would basically be grabbing all of the content on their page, and actually copying it to your page (which is entirely different than simply "framing" it). So there may be some copyright or hotlinking issues if you go that route. Best to contact them first and ask if they would be OK with that.

          If you're not comfortable with PHP though, then you probably wouldn't want to attempt this anyways. But, I just thought I'd throw it out there as another possible option.
          Ok. Thanks for the help but I think it will be too complicated for me. I can some HTML but I'm not a PHP and Java coding geek :p So I think I'll pass this.

          I can use a aStore stand-alone page instead. It will do the exact same job but it's not on my domain though. But good enough for me.
          {{ DiscussionBoard.errors[7324014].message }}

Trending Topics