Setting up the menu's layers
January 19, 1999
Setting up a menu's constituent layers in
vertical alignment, like preparing a chess board for play.
function setup(topic)
{
var objName="['"+topic+"']";
innerDivs=eval(obj+objName+innerLayersLength);
totalHeight=0;
//Netscape: arrange items
if (!document.all){
eval(obj+objName+innerLayer+"[0]"+
posWidth+"=window.innerWidth");
for (j=1;j<innerDivs;j++)
{ layerIdx="["+j+"]";
prevIdx="["+(j-1)+"]";
thisLayer="obj+objName+innerLayer+layerIdx";
prevLayer="obj+objName+innerLayer+prevIdx";
thisLayer=(eval(thisLayer));
prevLayer=(eval(prevLayer));
if (j==1) {gap=2} else {gap=0}
totalHeight+=eval(prevLayer+posHeight2)+gap;
eval(thisLayer+posTop+"="+prevLayer+
posTop+"+"+prevLayer+posHeight2+"+gap");
eval(prevLayer+posWidth+"=window.innerWidth");
eval(thisLayer+posWidth+"=window.innerWidth")
}
}
//MSIE: arrange items
if (document.all){
divsArray=new Array();
divCount=0;
tag=".tagName";
for (j=0;j<innerDivs;j++)
{ childIdx="["+j+"]";
thisChild=eval(obj+objName+innerLayer+childIdx+tag);
if (thisChild.toLowerCase()=="div")
{ divsArray[divCount]=j;
divCount++
}
}
for (j=1;j<divsArray.length;j++)
{ layerIdx="["+divsArray[j]+"]";
prevIdx="["+divsArray[j-1]+"]";
thisLayer="obj+objName+innerLayer+layerIdx";
prevLayer="obj+objName+innerLayer+prevIdx";
thisLayer=(eval(thisLayer));
prevLayer=(eval(prevLayer));
if (j==1) {gap=2} else {gap=0}
totalHeight+=eval(prevLayer+posHeight2)+gap;
eval(thisLayer+posTop+"="+prevLayer+
posTop+"+"+prevLayer+posHeight2+"+gap");
}
}
totalHeight+=eval(thisLayer+posHeight2);
eval(obj+objName+posHeight+"="+totalHeight);
//eval(obj+"['backdrop']"+posHeight+"="+totalHeight);
}
|
The setup() function is long but its purpose is
straightforward: like settings up the pieces on a chessboard,
this function vertically aligns the items within a menu.
That's all it does, in fact, although it does so using
two separate sections of code -- one for each browser.
This function relies heavily on the eval() trick
demonstrated earlier to shuffle around the layers which
make up each menu into vertical alignment. And although
eval() was supposed to allow us to avoid writing
separate code for each browser in this case we had no choice
for reasons explained momentarily.
Internet Explorer 4 mouse events
DHTML Pop-Up Menus: A Parable of Triumph and Loss (Based on a True Story)
The menu revealed
|