AutoHeight IFrame

Question

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...?

This is my code:

on Head:
<script type="text/javascript" src="js/jquery.js" ></ script >
<script type="text/javascript" src="js/iframe.js"></script >

on Body:
<iframe scrolling="no" frameborder="0" width="1025" src="http://mydomain.com"/>
</iframe>

Answer 1

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.