DHTML Lab - dhtmlab.com - Hierarchical Menus Ver. 3 - Addendum III (v3.03) | 2

Hierarchical Menus Ver. 3 - Addendum III (v3.03)
menus for Communicator/Navigator 4.5

The Apparent Symptom

When Navigator 4.5 executed our menu script...nothing happened. Literally! No errors, but no menus either. The viewer was left with the page as it was intended by the author, but without the menu functionality. The behavior was the same as one would expect from a non-DHTML browser (since our menu code is transparent to older browsers). It seemed as if Navigator 4.5 had been filtered out by the author elegantly.

Of course, Navigator 4.5 had not been filtered out, but this "harmless" behavior is a developer's dream: If it doesn't work, no errors, and no harm done!

The Real Symptom

In reality, Navigator 4.5 loaded the menu script, and attempted to execute it. Somewhere, the execution failed. Although an error should have been generated, it wasn't. Something in our script made it return from code execution gracefully.

The Problem Function

Those of us who use a script debugger, or have the patience to follow our script execution line-by-line, discovered that the graceful death of our script occured in the makeElement() function:

function makeElement(whichEl,whichWidth,whichParent,whichContainer) {
   if (NS4) {
      if (whichWidth) {
         elWidth = whichWidth;
      }
      else {
         elWidth = (whichContainer) ? whichContainer.menuWidth : whichParent.menuWidth;
         if (whichContainer) elWidth = elWidth-(borWid*2)-(itemPad*2);
      }
   if (!whichContainer) whichContainer = menuLoc;
      eval(whichEl + "= new Layer(elWidth,whichContainer)");
   }
   else {
      elStr = "<DIV ID=" + whichEl + " STYLE='position:absolute'></DIV>";
      menuLoc.document.body.insertAdjacentHTML("BeforeEnd",elStr);
      if (isFrames) eval(whichEl + "= menuLoc." + whichEl);
   }
   return eval(whichEl);
}

The specific problem line is highlighted in purple above.

Purpose of Offending Function - Recap

Recall that whenever we need to create a positioned element, (layer), whether it be the container menu (both browsers) or a component menu item (Navigator-only), we call makeElement():

1. whichEl:: the identifier for the new layer, as a string. For example, if we are creating the menu container which we will eventually refer to as elMenu1, we pass "elMenu1" as a string. This argument is used by both browsers.
2. whichWidth:: the wrapping width of the layer. This is a required argument of the new Layer() constructor, which we use to create layers on-the-fly. We only use it when creating a top-level menu (a parent menu). All other levels in the same menu tree, and menu items, get their wrapping width from the parent. Therefore, it has an integer value when a parent menu is being created, and a null value for all other cases. This argument is used only by Navigator, as the width is applied dynamically after creation in Explorer.
3. whichParent:: The top-level menu identifier in the menu tree. This argument is an object (eg. elMenu1, elMenu2, etc.) if the menu being created is a child menu or item and a null value if the menu is a parent. This argument is used only by Navigator, since it is used to obtain the width for any child menus and all items.
4. whichContainer:: Necessary if the layer is a menu item. It identifies the menu the item is to be placed in. If the argument is omitted, the script assumes that the layer is a menu and creates it within the window object, represented by the menuLoc variable. Again this argument is Navigator-specific, since makeElement() is used only for menu creation (not item creation) in Explorer.

Hopefully, it's all coming back to you. The function argument recap should help you in recreating the steps the function goes through in creating a new layer, whether for a menu or menu item.

On the next page, we'll look at the purpose of the offending line, and modify it to work with Navigator 4.5.

Produced by Peter Belesis and

URL: https://www.webreference.com/dhtml/column21/addendum3/col21addIII2.html