DelphiFAQ Home Search:
General :: Web publishing :: JavaScript :: Document


Articles:

This list is sorted by recent document popularity (not total page views).
New documents will first appear at the bottom.

Featured Article

Adjusting the height of an IFRAME according to its content

Question:

On my page I display search results in an IFRAME. Sometimes there's only 5 rows of data, sometimes it can be 2000. I need to have the IFRAME size adjust to the number of elements. I was working with a construct like
iframe_1.height = 30 + 16 * (number_of_rows)

but this estimating formula relies on a certain font size. And it looks really wrong in Netscape or Opera.

Answer:

Why estimate if you can make an exact calculation of the document height? Take the code below which will work on Internet Explorer and various Netscape versions.

<script type="text/javascript">
 function adjustIFrameSize (iframeWindow) {
   if (iframeWindow.document.height) {
     var iframeElement = parent.document.getElementById(iframeWindow.name);
     iframeElement.style.height = iframeWindow.document.height + 'px';
     iframeElement.style.width = iframeWindow.document.width + 'px';
   }
   else if (document.all) {
     var iframeElement = parent.document.all[iframeWindow.name];
     if (iframeWindow.document.compatMode &&
         iframeWindow.document.compatMode != 'BackCompat') 
     {
       iframeElement.style.height = 
         iframeWindow.document.documentElement.scrollHeight + 5 + 'px';
       iframeElement.style.width = 
         iframeWindow.document.documentElement.scrollWidth + 5 + 'px';
     }
     else {
       iframeElement.style.height = iframeWindow.document.body.scrollHeight + 5 + 'px';
       iframeElement.style.width = iframeWindow.document.body.scrollWidth + 5 + 'px';
     }
   }
 }
 </script>
 

Generated 4:02:13 on Mar 26, 2017