Menu
hi
Have been developing a javascript menu with 1 sub menu. The main part of the menu is in a DIV tag within a table so it is in the correct position however the submenu is another floating layer using a DIV tag and style.left to position it. The following functions show how it is displayed and positioned.
After changing the getObj function to work with netscape all was fine in both IE and NN. However another function written that repositions the submenu layer (the 2nd DIV tag) according to browser dimensions fails to work in NN but is still fine in IE. As can be seen the style.visibility property seems to work fine for both browsers however the style.left property doesnt seem to be able to be written to in NN. Where am i going wrong with this? As can be seen i have tried an alternate method that is commented out but still no luck in NN all i get when the property is viewed is the original position of 150px in the style.left attribute.
Can someone help i have been stuck on this for a while and would like it working nicely and correctly in as many browsers as possible. Also would most appreciate if someone could explain the differences to make this compatible in opera as the submenu layer needs to be able to open accross an iframe.
Thanks for any help
Nick Ford
/* Set of functions that handle the operation of a menu consisting of 2 layers
[email][email protected]
*/
/* Browser type and menu timer variables
var isNetscape = (navigator.appName == “Netscape”);
var timer;
/* This gets the layer object passed according to browser type
function getObj(obj) {
if(isNetscape) {
retLayer = document.getElementById(obj).style;
//retLayer = document.layers[obj];
}else {
retLayer = eval(“document.all.” + obj + “.style”);
}
return retLayer;
}
/* Makes the passed layer visible
function show(layer) {
obj = getObj(layer);
obj.visibility = “visible”;
}
/* Hides the passed layer
function hide(layer) {
obj = getObj(layer);
obj.visibility = “hidden”;
}
/* Find the availble width of the browser content window
function getScreenWidth() {
available = (isNetscape) ? window.innerWidth : document.body.clientWidth;
return available;
}
/* Show or hide the submenu according to true or false passed
function menuRoll(status) {
if (status) {
show(“submenu0”);
}else {
hide(“submenu0”);
}
}
/* Reposition the submenu on the page according to the size of the window
function repositionMenu(isResize) {
obj = getObj(“submenu0”);
curW = getScreenWidth();
if(curW > 800) {
/*Half the browser width finds the centre of the page – half the page layout + the offset
newL = (curW/2 – 360) + 140;
obj.left = newL;
//document.getElementById(“submenu”).left = newL
}else {
obj.left = 150;
}
}