Search code examples
salesforceapex-codevisualforce

How do I get my Customer Portal to auto-adjust its component's size?

I have a few HTML Home Page Custom Components titled Custom_News, Custom_Articles, and CUstom_Cases.

Here's the HTML for them:

<iframe src="/apex/NewsPage?id=a1TW0000000EJAL" frameborder="0" width="100%"></iframe>&nbsp;

<iframe src="/apex/Custom_Home" frameborder="0" width="100%"></iframe>&nbsp;

<iframe src="/apex/CasesPage" width="100%" frameborder="0"></iframe>&nbsp;

This is what my Customer Portal Home Page layout looks like:

enter image description here

and this is what the Custom Components look like when I login to the Customer Portal:

enter image description here

How do I get rid of the scroll bars? I want the Customer Portal to auto adjust to the size of the components so that none of the components will have scroll bars. How do I do this?

Solution

  • This is what I ended up doing:

    <script language="JavaScript">
    function resizeIframe(newHeight, id){    
        document.getElementById(id).style.height = parseInt(newHeight,10) + 'px';
}
</script>
<iframe id="iframe2" src="/apex/NewsPage?id=a1TW0000000EJAL" frameborder="0"  ="" onload="parent.resizeIframe(1.5*document.body.clientHeight,'iframe2');"  height="100%" width="100%"></iframe>