Is this even possible with jquery only with no bulky plugins?

I know there are lots of plugins and alternatives, i'm searching for the shortest, robustest & most cleanest (preferably relying on jquery)

Here basic jsfiddle to tryout your thoughts: /

Is this even possible with jquery only with no bulky plugins?

I know there are lots of plugins and alternatives, i'm searching for the shortest, robustest & most cleanest (preferably relying on jquery)

Here basic jsfiddle to tryout your thoughts: http://jsfiddle/3vPJd/

• javascript
• jquery
• iframe
• dynamic
• height

• what do you mean by dynamic height? like resizes as the window does or what exactly? – Joseph Marikle Commented Sep 15, 2011 at 21:29
• since the parent page doesn't have access to the content within the iframe (it is from a different domain), the parent page cannot figure out what height the iframe's content is. – Kevin B Commented Sep 15, 2011 at 21:31
• I want to have the iframe copy the height of the 3th party page. – Writecoder Commented Sep 15, 2011 at 21:32
• yes, but how are you going to get the height of the 3rd party page? the parent page doesn't have access to that information. – Kevin B Commented Sep 15, 2011 at 21:33
• Here a working example: css-tricks./examples/iFrameResize/… – Writecoder Commented Sep 15, 2011 at 21:36

2 Answers 2

I have to go with "This is not possible" due to the fact that the parent page cannot get the height of the 3rd party page since it is from a different domain than the parent page.

Edit: It is possible to do this if you have some control of the 3rd party page.

I personally would just use the method they already have implemented, it doesn't require jQuery, you just have to include the frame.js.

At that point, all you need is a method on the parent page that listens for when the hash changes and resizes the iframe accordingly, which is also already written by the site you linked. it is a very clean solution already, no real need to modify it. It can be found here.

This little library will do what you want. It uses postMessage to talk between the iFrame and the parent, so works cross domain. It also uses MutationObserver and EventListeners to detect changes to the content and keep the iFrame correctly sized.

https://github./davidjbradshaw/iframe-resizer