PDA

View Full Version : Using a variable instead of a concrete value!

Mr Cube Head
04-05-2005, 05:20 AM
Hello Everyone,

I am currently developing a small script that will open a "Help Dialog". The "Help Dialog" is created using the handy 'window.open()' function.

Simply opening a window which has been provided with concrete attribute values is easy, e.g.: window.open('helpdialog.htm','Help','height=200, width=200');

However I am interested in setting the height, width, screenX and screenY information dynamically based upon the users screen resolution (and ultimately the available screen area).

I have written (and included below) code to this end. My challenge lies in setting attribute values dynamically within the code.

e.g.:

var boxHeight = getScreenHeight() / 2;

window.open('helpdialog.htm','Help','height=boxHeight'....)

Simply including the "boxHeight" variable in the window.open() method does not work. I have considered adding height, width, screenX and screenY values to the function call (listed below) which is responsible for opening the new window. However I do not think that this approach will be a fundamental improvement.

Any help with working out how to include dynamic values in my script will be greatly appreciated.

<html>
<head>
<title> Help Pop-Up box spawning page </title>

<script type="text/javascript">
//<!--

/***** Determine the available screen area for content display. *****/

var screenHeight = getScreenHeight();
var screenWidth = getScreenWidth();

var boxHeight = screenHeight / 2;
var boxWidth = screenWidth / 2;

function getScreenHeight()
{
if(window.innerHeight) // For NN4 & W3C
{
return window.innerHeight;
}
else
if(document.documentElement) // For IE6+
{
return document.documentElement.offsetHeight;
}
else
if(document.body.clientHeight) // For IE4 & IE5
{
return document.body.clientHeight;
}
}

function getScreenWidth()
{
if(window.innerWidth) // For NN4 & W3C
{
return window.innerWidth;
}
else
if(document.documentElement) // For IE6+
{
return document.documentElement.offsetWidth;
}
else
if(document.body.clientWidth) // For IE4 & IE5
{
return document.body.clientWidth;
}
}

function openWindow(pageAddress, pageName)
{
window.open(pageAddress, pageName, 'height=boxHeight,width=boxWidth,left=10,top=10,screenX=10,screenY=10');
}
//-->
</script>
</head>
<body>
<a href="#" onclick="openWindow('helpbox.htm','help')">Click for Help Dialog</a>
</body>
</html>

Thanks for your help.

Regards

Davo
glenngv
04-05-2005, 05:27 AM
window.open(pageAddress, pageName, 'height=' + boxHeight + ',width=' + boxWidth + ',left=10, top=10, screenX=10, screenY=10');
Mr Cube Head
04-05-2005, 05:30 AM
glenngv,

Thanks heaps for your help there. Such a simple thing.....but it was eluding me! Thanks again.

Regards

Davo