I'm stuck with a big problem. :sad: :sad: :sad:
I have the following script resizeing my iframe based on height. The problem is if my site is on one domain say http://mydomain.company.com and the target page is on another domain say http://anotherdomain.mycompany.com the script does not resize the page. I cannot add anything to the pages i am linking to because they live in a CVS repository so i cannot call a function or passs information in that way.

is there any way to make my script work? I'm so fustrated, I'm so close! help!

<!--this script auto resizes the height of the iframe based on contents-->
<script type="text/javascript">
function resize_iframe(){
document.getElementById("_iframe").height=768 // required for mozilla/firefox bugs, value can be "", null, or integer
// -->

which uses the following iframe
<iframe width=96% id="_iframe" name="_iframe" src="intro.htm" scrolling="no" frameborder="no" ALLOWTRANSPARENCY="true" onload=resize_iframe();></iframe>

11 Years
Discussion Span
Last Post by naksindia

I've dealt with this scenario extensively, so I think I understand what you are trying to do and what you are asking.

As you've discovered, you cannot use client-side script to work with the document object model of remote site content. (Even if that "remote" site is on your own server--just another domain.) I don't have a perfect solution, but I have 2 options for you based on your needs.

1. Don't use an IFRAME, use a normal FRAME. For example, your content on the top or left, and the content frame on rest of page. It will auto-size for content whereas an IFRAME will not. (I also recomment avoiding frames wherever possible, but for some applications, they really fit the bill.)

2. Do you just need the display of the remote content? If so, you can screen scrape the remote content server-side, then display it in your page. If you do this, it becomes your "own" content, and you can do anything script-wise you want. Most likely, though, you actually want your users to work with the content--clicking links, etc. that reload from the remote domain. In this case, a screen-scraping solution does not help you.


While I would agree with Troy, if you still need to do it with iframes, this might work. I havent tried it out with your specific problem though.

In the past I have had special situations where I needed to change html so I used <div> tags. This might be unconventional but try this

<div id="myframe">

(your iframe tags go here)


Then with javascript try this

document.getElementById('myframe').innerHTML = yourHTML

Where yourHTML has new iframe html with new properties.

Like I said, I havent tried with iframes but it works in lots of other areas


You can do this by using the following method;

Thanks for the post Eddie! Looks like some helpful info. However, Jaxs, this will not work for you since you do not control the page being loaded into the IFRAME. Notice this from the pate Eddie posted:

It is important to note that the script is placed in the page that is being loaded into the IFrame.

The page you are loading into the IFRAME is a third-party page that you do not control. Right?


I have control of the pages but due to the fact that there are thousands of them of all different types that live in a CVS Repository, adding code to every page is not the solution.

The reason that scripts don't work across a different domain is http://msdn.microsoft.com/workshop/author/om/xframe_scripting_security.asp
is there a way i can get around this?

Also I started a new thread because i wanted to try to use a hidden iframe as a buffer for a <div> i am not sure how to implement it though. I cannot seem to find any good documentation online about it.


You are not going to get around the cross-domain scripting security.

If you are thinking you'll use a hidden IFRAME to load the remote-domain page, then in your page, script copying the IFRAME's content into your own DIV, you will have the same cross-domain security issue. BUT, here is how you can do this:

<script language="javascript">
function LoadDiv(id) {
 document.getElementById(id).innerHTML = eval(id+"_frame.document.body.innerHTML");

<div id="fred"></div>

<iframe name="fred_frame" style="display:none;" frameborder="0" scrolling="no" marginwidth="0" marginheight="0" src="somepageonmyserver.htm" onload="LoadDiv('fred');"></iframe>


And you'll have the same problems as you would if you used server-side scripting to scrape the content then put it in your page. That is, relative links in the page will not work. Relative links to style sheets and javascripts will not work so the page may not look or function as expected.


Thanks!!! I think you are on to something there.
I tried the code you gave me.
From my menu, when i send links to the frame target, fred_frame for instance, it loads the page i want in the div area, but when i click a link from the newly loaded page it does not open inside the div it overwrites the entire page. :sad: The links are not relative.
How do i have all the links from the loaded pages stay in the frame like they do in regular iframes , without the addation of the target="" to every link. Shouldn't the links stay in the frame because they are loaded in the frame? :confused:


No, once you copy the source from the frame into your div, it's in your parent page. Links clicked in that page will open in that same page by default.


I wrote a PHP proxy script that has some applications relevant to this thread, so thought I'd update the thread with this....

If your webserver supports PHP, I have a script that is a solution to the cross-domain security issues when doing things such as AJAX requests, etc. Instead of directly requesting the content, request my proxy.php passing in the real URL that you want. The proxy.php script will go fetch the content for you and forward back that response to your client script. It echoes back the full headers and response body.


One problem people run into when using a proxy to get content is that relevant URLs in links break. You can solve this by parsing the body text, look for links, and if the link does not start with 'http://', insert the original site url. It's not exactly a simple thing to do, but a solution I've built in the past.


hi!! you can allow the iframe to autosize the height and width with the following Attributes:
width="100%" height="100%"

This article has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.