nisgar2k
07-06-2003, 04:29 PM
The DIV tag below contains the layer information for my submenu that extends from a fixed point on my webpage ie a fixed menu in a table.
<div id=submenu0 style="LEFT: 150px; POSITION: absolute; TOP: 210px; Z-INDEX: 1; overflow: auto; visibility: hidden;">
The javascript below is called when the page is resized loaded etc to repositioin the 'left' style attribute of the div tag in order to keep the submenu in the correct position depending on screen resolution etc.
/* Set of functions that handle the operation of a menu consisting of 2 layers
* Written by Nicholas Ford nisgar2k@hotmail.com
*/
/* 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() {
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;
}else {
obj.left = 150;
}
}
The above code works correctly on IE however on netscape the repositioning is incorrect and fails to update the left style attribute! can someone help with a solution for all the browser versions and briefly explain the whole layering div etc information for netscape opera and ie as i am still very much in the infancy stages of learning to write cross browser solutions. Also I would most appreciate someone telling me why when my submenu wont appears above an iframe in opera it is partially invisible as if the iframe is on top!
Thanks for any fixs in advance
Nick Ford
<div id=submenu0 style="LEFT: 150px; POSITION: absolute; TOP: 210px; Z-INDEX: 1; overflow: auto; visibility: hidden;">
The javascript below is called when the page is resized loaded etc to repositioin the 'left' style attribute of the div tag in order to keep the submenu in the correct position depending on screen resolution etc.
/* Set of functions that handle the operation of a menu consisting of 2 layers
* Written by Nicholas Ford nisgar2k@hotmail.com
*/
/* 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() {
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;
}else {
obj.left = 150;
}
}
The above code works correctly on IE however on netscape the repositioning is incorrect and fails to update the left style attribute! can someone help with a solution for all the browser versions and briefly explain the whole layering div etc information for netscape opera and ie as i am still very much in the infancy stages of learning to write cross browser solutions. Also I would most appreciate someone telling me why when my submenu wont appears above an iframe in opera it is partially invisible as if the iframe is on top!
Thanks for any fixs in advance
Nick Ford