I have a visual force page that I will be adding to a contact page as an iframe. In this visual force page I am using an outputPanel with a set height for overflow. I can just give it a set amount of pixels for the height but I would rather do it relative to the amount of pixels the user gives the iframe in the layout of the contact page. Any ideas?
The list of numbers goes on to 20 but it gets cut off after the 200 pixels that I set for the page in the layout. Here is the code for the page
<apex:pageBlock >
<apex:pageBlockSection title="List Of Numbers" columns="2" >
<apex:pageBlockSectionItem id="columnWithScroll">
<apex:outputPanel layout="block" style="overflow: auto; height: 80%;">
<apex:repeat value="{!numbers}" var="number">
<apex:outputText value="{!number}" />
<br/>
</apex:repeat>
</apex:outputPanel>
</apex:PageBlockSectionItem>
<apex:pageBlockSectionItem id="columnWithoutScroll">
<apex:outputPanel >
<apex:outputText value="I don't want this section to move" />
<br/><br/>
<apex:outputText value="If the left column gets too long" />
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageBlock>
Best Answer
I think the problem here is to measure the given static height of the iframe, where you can't use javascript to directly read the property because of XSS-limitations, right?
If so, we could try to figure out the given height indirectly. If you got the height, you can make your calculation an make relative adjustments to your content. I will not provide full code but my approach should be easy enough to follow:
<div id="wrapper" style="display:none;">
to hide everything.Hope this is enough to get it done.