function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion

Dynamic Iframe Height


I am having a VF page which just has an apex:detail tag. So, it is basically a replica of a standard page. But that standard page has an inline VF page and the content height of that inline VF page is uncertain. So, it displays a scroll bar if the content height is longer. 


My requirement is to remove the scroll bar and dynamically adjust the height of inline vf page which is a part of apex:detail tag. 


Any ideas?






i think you may stop the scroll by writing a style like style="overflow:hidden"...


try like this....


<body onload=”resizeFrame(document.getElementById(‘childframe’))” bgcolor=”#cccccc”>

<script type=”text/javascript”>
// Firefox worked fine. Internet Explorer shows scrollbar because of frameborder
function resizeFrame(f) { = f.contentWindow.document.body.scrollHeight + “px”;

<p>Parent frame.</p>
<p>Parent frame.</p>
<p>Parent frame.</p>
<p>Parent frame.</p>

<iframe frameborder=0 border=0 src=”./child-frame.html” name=”childframe” id=”childframe”>


Thanks Kiran.


But the issue is the content should not be hidden. The height of the window should be dynamically adjusted to accommodate the size of the content.


So, I tried a similar code like the one you suggested. But the problem here is onload event on body tag in a vf page is not working. Because that VF page will have its own body tag and because of that the body tag which I added was ignored when the page executed. 


na na... u can add the script tag and call  this function directly.. i just gave the example based on html....


u can use the body tag direclty in the vf page...


<body onload="X();"></body>