Hello, i want to make a iframe page that loading a page from other site. I have try "jQuery iFrame Sizing" to set auto height in iframe... but it is failed.
What's the problem...?
on Head < script type="text/javascript" src="js/jquery.js" > < script type="text/javascript" src="js/iframe.js">
on Body
thanks
It's possible, but not straight forward. I know that the Shindig opensocial container does something similar. Gadgets hosted in an iframe can request that the container dynamically resizes the iframe in response to changes in the gadget content inside the iframe.
The code for handling this lives in the shindig svn repo at dynamic-height.js and dynamic-height-util.js.
Hopefully you can extract something usable from there.
First two lines from original site:
Note: Due to browser security limitations related to cross-site scripting, this solution works only for iframe page content called from the same domain
Yes, due to browsers security limitations Javascript doesn't have the access to iframe's source that is loaded from a another domain. However there is a workaround for that, not ideal, but it works.
You can "outsmart" the browser using a simple local script that will load and output contents of mydomain.com. Then point the iframe src to this script. In that case browser will think you're dealing with the same domain and limitations won't apply.
So instead of this:
<iframe scrolling="no" frameborder="0" width="1025" src="http://mydomain.com" />
You may try something like this:
<iframe scrolling="no" frameborder="0" width="1025" src="/local-script.php?url=http%3A%2F%2Fmydomain.com" />
Then you can add a simple logic into local-script.php that loads contents of domain/document you want and everything should be fine. LMK, if you need an example of PHP script.