Gerardo Ramírez wrote:
This is the function wich is called for displaying the menu
[...] What I want is to set all this parameters accordingly to the size of
the window,
so the menu always shows up and fits the cell of the table used for
layout of the page.
If the menu is inside a table cell, then don't you want it to
fit the cell, not the window?
Make the size parameters into variables that are passed to the
menu function. Then call the menu from another function that
knows or gets the size of the table cell.
Here is some play code that gets the current size of an element,
then makes another element the same size. It uses divs, but the
theory should be the same.
It works in Firefox (getComputedSty le) and IE (currentStyle).
Note that it separates the units that are returned as the thing
I wrote it for wanted to modify the size, so the units had to be
preserved. I've left the code in but you could safely remove it
if all you are doing is copying the returned size to the new
element.
All the "msg" lines can be removed, they're just for demo and
debug to let you know what's going on.
Firefox always reports px, but IE reports whatever was used to
set the height & width = em, px, etc.
It's lightly commented, come back if you need more help.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title> Resize element </title>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1">
<style type="text/css">
..div0 {border: 1px solid red; width: 10em; height: 15em;}
..div1 {border: 1px solid blue;}
</style>
<script type="text/javascript">
function sameSize(a,b){
var msg = '';
b = document.getEle mentById(b);
// Zilla stuff
if (window.getComp utedStyle) {
var h = document.defaul tView.getComput edStyle(a,
'').getProperty Value('height') ;
var w = document.defaul tView.getComput edStyle(a,
'').getProperty Value('width');
msg += '\ngetComputedS tyle (h,w): ' + h + ', ' + w;
// IE stuff
} else if (a.currentStyle ) {
var h = eval('a.current Style.height');
var w = eval('a.current Style.width');
msg += '\ncurrentStyle (h,w): ' + h + ', ' + w;
}
// Split off numbers and units
hu = h.replace(/[\d|.]/g,'');
h = h.replace(/[^\d|.]/g,'');
wu = w.replace(/[\d|.]/g,'');
w = w.replace(/[^\d|.]/g,'');
// Apply to the target element
if (b.style) {
msg += '\n\nSetting ' + b.id + ' to (h,w):'
+ h + hu + ', ' + w + wu;
b.style.height = h + hu;
b.style.width = w + wu;
}
alert(msg)
}
</script>
</head>
<body>
<div id="div0" class="div0" onclick="sameSi ze(this,'div1') ;">
This is div0,click on me to make div1 the same size</div>
<div id="div1" class="div1">th is is div1</div>
</body>
</html>
--
Rob
