Changing object position Dynamically

getElementById, styles.left/top, dynamic positioning, javascript

[ramonsodoma]

Fellow jscripters,
Iīm trying to position layers dynamically on a page, but I canīt get the base layer to define posx and posy variables to a specific div (with id and class).
The idea is to create a menu system, that has multiple levels if needed. As the mouse overs a main item, itīs sub level will show, at a specific position, and if any sublinks have sublevels, they will show at a position relative to itīs header...(donīt know if itīs clear)

Iīve tried so many things now that I donīt have a good example. But maybe someone can help edit code from Martial Boissonneaultīs menubar... it only has 1 level (In my opinion, a menu that has more than 2 levels is flawed, but tell that to those who call the shots..)

when I use menu[obj].style.left in Mozilla/IE6 itīs useless...

var ns4=(document.layers)?true:false;
var ie4=(document.all)?true:false;
var gecko=(document.getElementById)?true:false;
function iniciarMenu(obj,obj1){
if(gecko){
var myObj=document.getElementById(obj);
var myObj1=document.getElementById(obj1);
var posx=myObj.style.left;
var posy=myObj.style.top;
alert(posx);
}
}

[Purple Martin]

style.left and style.top will give you the values of those style properties, which can be either relative or absolute. It might be more useful to look at the offsetLeft and offsetTop properties, which gives you the position of the element relative to it's parent. To access properties of the element's parent you can use the element's offsetParent property. Look these things up in your favourite reference book/site for details of how they work.