place a javascript menu inside a cell of a table.

D

Dacian

Hi,

I´m trying to place a javascript navigation menu inside a cell of
a table in my page, the problem is that the constructor of the menu
object has parameters for menu positioning and size and when the
window is rezised the menu stands at the same position and with the
same size.

My question is: is there a way to modify those parameters
dinamically to match window size, and how is that made, or is there
another way to include that menu using a table for page layout.

Thanks.
 
R

RobB

Dacian said:
Hi,

I´m trying to place a javascript navigation menu inside a cell of
a table in my page, the problem is that the constructor of the menu
object has parameters for menu positioning and size and when the
window is rezised the menu stands at the same position and with the
same size.

My question is: is there a way to modify those parameters
dinamically to match window size, and how is that made, or is there
another way to include that menu using a table for page layout.

Thanks.

You've asked a rather detailed question about a "javascript navigation
menu" which has "parameters". What sort of answer could anyone provide
with that level of detail?

Using the window's onresize handler might be of help. Got a link to
that script, or an example?
 
R

RobG

Gerardo said:
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 (getComputedStyle) 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.getElementById(b);

// Zilla stuff
if (window.getComputedStyle) {
var h = document.defaultView.getComputedStyle(a,
'').getPropertyValue('height');
var w = document.defaultView.getComputedStyle(a,
'').getPropertyValue('width');
msg += '\ngetComputedStyle (h,w): ' + h + ', ' + w;

// IE stuff
} else if (a.currentStyle) {
var h = eval('a.currentStyle.height');
var w = eval('a.currentStyle.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="sameSize(this,'div1');">
This is div0,click on me to make div1 the same size</div>
<div id="div1" class="div1">this is div1</div>

</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top