I have been looking everywhere for a piece of code that made the height of an iframe auto adjusts while showing contentment from an external domain. (ex: my domain mydomain.com showing google.com). I need a script that does that

Or something that may be harder is that it counts the number of divs with a certain id and multiplies that my a number to make the iframe height, Possible?

Thank You

Recommended Answers

All 11 Replies

Probably not, there is no simple way (or any way at all for that matter) to determine content height unless it is a style on the page (Ex. something like maybe:

.myDivThatIWantTheHeightFrom {
 height: 50px;

I'm not sure though even in that case if you could determine height.

So are you saying that lets say these is a div that is set to 50 px through css in the external domain i can make the iframe that height?

Yes simply add the height property to the iframe like so:

<iframe src="http://externaldomain.com" height="50"></iframe>

Now that I think about it, there might be a JavaScript fix that could help, but I'm not sure it would work, nor would it work everywhere.

No but i want to do it dynamically so when a new page loads it loads to that height.

do it ANother way
frameset instead of iframe
this is a file 'external.php' that we use to load outside files under a little header that says external file and a menu the file takes a parameter $ext that is the file to load

<?php ob_start('ob_gzhandler'); ?>
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Frameset//EN' 'http://www.w3.org/TR/html4/frameset.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<Title>Linking <?php if(!$ext){$ext = '/home2.php';} echo $ext ; ?></Title>
<LINK rel='StyleSheet' HREF='/style.css.php' TYPE='text/css' MEDIA='all'>
<script language='javascript' type='text/javascript' src='/script.js.php'></script>
<frameset rows='100,*'>
<frame name='Menu' SRC='menu2.php' TITLE='Menu'>
<frame name='Content' SRC='<?php echo $ext; ?>' TITLE='Content'>
<?php ob_flush(); ?>

(stylesheets and javascripts are .php files, mod_gzip.)

And that's exactly what I'm saying. It could be done with JavaScript but it won't be compatible everywhere and there's no guarantee it will work. It would be something like this...

<head><titleDynamic iFrame Height</title>
<script type='text/javascript'>
var divName = 'testDiv'; //ID of the div you want to adjust height for
function dynamicIframe(name)
 if(name=='') name = divName;
 document.getElementById('iFrame').style.height = document.getElementById('iFrame').document.getElementById(name).style.height;
<iframe src="thispage.html" height="100" width="100%"  id="iFrame" onload="javascript:dynamicIframe();"></iframe>

Simply replace divName with the name of the tag you would like to adjust height of iFrame for.

so there is no way possible? That sucks.

No I didn't say that. You can try AlmostBob's suggestion or my JavaScript solution.

I will just leave it alone. The set up i have is ok, with scrolling iframe

You can't count divs with a certain id, because ids are not allowed to be used more than once.

Yes but he wanted to know the height of a div. As long as the div has an id you can figure that out.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.