speder
asked on
Accessing iframe properties when source is foreign host
Hi
I've got a website a (www.aaa.com) that contains something like this:
************************** *********
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
<!--
function adjustifr()
{
document.getElementById('i fr').style .height = ifr.document.body.scrollHe ight + 20;
}
//-->
</script>
</head>
<body onLoad="adjustifr();">
<body>
<iframe id="ifr" name="ifr" src="www.bbb.com" width="760" marginwidth="0" marginheight="0" frameborder="0"></iframe>
</html>
</body>
************************** ***
So what I want is to resize the iframe according to its content's length. This throws a "access denied" error presumably because the iframe's source is a foreign host. It works with the source is the localhost.
Is there a way to sort this out? Or perhaps a different strategy?
I've got a website a (www.aaa.com) that contains something like this:
**************************
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
<!--
function adjustifr()
{
document.getElementById('i
}
//-->
</script>
</head>
<body onLoad="adjustifr();">
<body>
<iframe id="ifr" name="ifr" src="www.bbb.com" width="760" marginwidth="0" marginheight="0" frameborder="0"></iframe>
</html>
</body>
**************************
So what I want is to resize the iframe according to its content's length. This throws a "access denied" error presumably because the iframe's source is a foreign host. It works with the source is the localhost.
Is there a way to sort this out? Or perhaps a different strategy?
Hi speder,
You can try this, although it's not supported by some older browsers, it should work:
(This uses a <div> instead of an iframe because it can expand. You can set the div borders to look like an iframe with CSS):
function getPage(url) {
var xhttp = (document.all) ? new ActiveXObject("Microsoft.X MLHTTP") : new XMLHttpRequest();
xHttp.open("GET", url, false);
if (document.all) {xHttp.send();} else {xHttp.send(null);}
return(xHttp.responseText) ;
}
Then have this in the <div>
<div style="width:760px;">
<script language="javascript">
document.write(getPage("http://www.bbb.com/") );
</script>
</div>
Regards,
Zyloch
You can try this, although it's not supported by some older browsers, it should work:
(This uses a <div> instead of an iframe because it can expand. You can set the div borders to look like an iframe with CSS):
function getPage(url) {
var xhttp = (document.all) ? new ActiveXObject("Microsoft.X
xHttp.open("GET", url, false);
if (document.all) {xHttp.send();} else {xHttp.send(null);}
return(xHttp.responseText)
}
Then have this in the <div>
<div style="width:760px;">
<script language="javascript">
document.write(getPage("http://www.bbb.com/")
</script>
</div>
Regards,
Zyloch
ASKER
Zyloch> That's a nice idea but unfortunately I need an iframe. Otherwise it won't work with the links on the external site.
Stormy> What I want is simply the iframe to adjust to the height of the content in order to avoid scroll bars.
Does it make any difference that I control both domains, i.e. the one with the iframe-tag and the one inside the iframe?
Stormy> What I want is simply the iframe to adjust to the height of the content in order to avoid scroll bars.
Does it make any difference that I control both domains, i.e. the one with the iframe-tag and the one inside the iframe?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
I think using style.overflow="scroll" might achieve what you want. What are you intending to accomplish?