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

8 Years
Discussion Span
Last Post by FlashCreations

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.


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

This question has already been answered. 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.