xPage panel set height via compute value

Hi

Situation:

1 xpage

3 custom controls (header, content, footer)

I have a panel in the footer that I’d like to use as my “spacer” in order to make the xpage fit to any screen size. This means that the header and content controls will stay as they are and the footer look like it moves up and down so that it remains at the bottom of the browser window.

I guess what I’m looking for is being able to set the height of the panel to allow the entire window to act as a 100% height.

Can anyone help with a solution?

Regards

Steven

Subject: xPage panel set height via compute value - update

I now have a working js function. The “spacer” is a div within a Panel. I have 3 panels on this particular xpage.

<xp:panel id=“panel2”>

<div id="spacer"></div>

</xp:panel>


function changespace() {

var myWidth = 0, myHeight = 0, b = 0, changeheight = 0;

if( typeof( window.innerWidth ) == 'number' ) {

	myWidth = window.innerWidth; myHeight = window.innerHeight;

} else if( document.documentElement && ( document.documentElement.clientWidth ||document.documentElement.clientHeight ) ) {

	myWidth = document.documentElement.clientWidth; myHeight = document.documentElement.clientHeight;

} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {

	myWidth = document.body.clientWidth; myHeight = document.body.clientHeight;

}

b = (document.height || document.body.scrollheight || document.body.style.pixelheight || document.body.clientHeight); 

changeheight = myHeight - b;

e=document.getElementById("spacer");

e.style.height = changeheight + 'px';

This runs well from a href when the page is loaded

Test add space

However I need to do this on the page load or milliseconds after the page load. Can anyone help ?