Link to home
Start Free TrialLog in
Avatar of bandolex2
bandolex2

asked on

Hiermenus for firefox.

Hi,

The popular menu Hiermenu version 3 doesnt work in Firefox, I guess the problem is that firefox didnt exsist in that time and probably when checking for browser version, hiermenu got stucked.

Since Firefox is very similar to Netscape, chances are that is hiermenus will work with firefox if its treated like netscape. I dont know how to do that and moving to a newer version of Hiermenus is not an option because they're chrging a lot for it.

Thanks,
Bandolex.

Posting hiermenu.js code:

/*hierMenus.js
* by Peter Belesis. v3.10.3 000731
* Copyright (c) 2000 internet.com Corp. All Rights Reserved.
* Originally published and documented at http://www.dhtmlab.com/
* You may use this code on a public Web site only if this entire
* copyright notice appears unchanged and you publicly display
* on the Web page a link to http://www.dhtmlab.com/.
*
* Contact pbel@websentric.com for all other uses.
*/

loader = (isFrames) ? (NS4) ? parent : parent.document.body : window;
loader.onload = startIt;
if(NS4){
      origWidth = loader.innerWidth;
      origHeight = loader.innerHeight;
      loader.onresize = reDo;
}
isLoaded = false;
NSresized = false;

if (!window.menuVersion) {
      clickKill = keepHilite = clickStart = false;
}

if (!window.imgHspace) imgHspace=0;

isWin = (navigator.appVersion.indexOf("Win") != -1)

mSecsVis = secondsVisible*1000;
isRight = (window.navFrLoc && navFrLoc == "right");
fullImgSize = (imgSiz+(imgHspace*2));
if(!IE5) {
       imgSuf = (isRight) ? ">"  : " ALIGN=RIGHT>";
       imgStr = "<IMG SRC='" + imgSrc + "' WIDTH=" + imgSiz + " HEIGHT=" + imgSiz +" VSPACE=2 HSPACE="+ imgHspace +" BORDER=0"+ imgSuf;
       if(IE4) imgStr = "<SPAN STYLE='height:100%;width:"+ (fullImgSize-(isRight?3:0)) +";float:"+ (isRight?"left":"right") +";overflow:hidden'>"+ imgStr +"</SPAN>";
}

areCreated = false;
menuLoc = null;

function initVars() {
      if(areCreated) {
            for(i=1; i<topCount; i++) {
                  cur = eval("elMenu"+i);
                  clearTimeout(cur.hideTimer);
                  cur.hideTimer=null;
            }
            clearTimeout(allTimer);
      }
      topCount = 1;
      areCreated = false;
      beingCreated = false;
      isOverMenu = false;
      currentMenu = null;
      allTimer = null;
}

initVars();

function NSunloaded(){
      isLoaded = false;
}

function NSloaded(e){
      if (e.target.name == mainFrName) {
            initVars();
            startIt();
      }
}

function IEunloaded() {
      initVars();
      isLoaded = false;
      setTimeout("keepTrack()",50)
}

function keepTrack() {
      if (menuLoc.document.readyState == "complete") {
            initVars();
            startIt();
      }
      else {
            setTimeout("keepTrack()",50);
      }
}

function startIt() {
      isLoaded = true;
      if (isFrames) {
            menuLoc = eval("parent.frames." + mainFrName);
            if (NS4) {
                  loader.captureEvents(Event.LOAD);
                  loader.onload = NSloaded;
                  menuLoc.onunload = NSunloaded;
            }
            if (IE4) {
                  menuLoc.document.body.onunload = IEunloaded;
            }
      }
      else {
            menuLoc = window;
      }
      menuLoc.nav = nav = window;
      if (clickKill) {
            if (NS4) menuLoc.document.captureEvents(Event.MOUSEDOWN);
            menuLoc.document.onmousedown = clicked;
      }
      makeTop();  
}

function makeTop(){
      beingCreated = true;
      if(IE4) {
            topZ = 0;
            for (z=0;z<menuLoc.document.all.length;z++){
                  oldEl = menuLoc.document.all(z);
                  topZ = Math.max(oldEl.style.zIndex,topZ)
            }
      }
      while(eval("window.arMenu" + topCount)) {
            (NS4) ? makeMenuNS(false,topCount) : makeMenuIE(false,topCount);
            topCount++
      }

      status = (topCount-1) + " Hierarchical Menu Trees Created"
      areCreated = true;
      beingCreated = false;
}

function makeMenuNS(isChild,menuCount,parMenu,parItem) {
      tempArray = eval("arMenu" + menuCount);
      
      if (!isChild) {
            tempWidth = tempArray[0] ? tempArray[0] : menuWidth;
            menu = makeElement("elMenu" + menuCount,tempWidth,null,null);
      }
      else {
            menu = makeElement("elMenu" + menuCount,null,parMenu,null);
      }
      menu.array = tempArray;
      menu.setMenuTree = setMenuTree;
      menu.setMenuTree(isChild,parMenu);

      while (menu.itemCount < menu.maxItems) {
            menu.itemCount++;
            status = "Creating Hierarchical Menus: " + menuCount + " / " + menu.itemCount;
            prevItem = (menu.itemCount > 1) ? menu.item : null;
            itemName = "item" + menuCount + "_" + menu.itemCount;

            menu.item = makeElement(itemName,null,null,menu);

            menu.item.prevItem = prevItem;
            menu.item.setup = itemSetup;
            menu.item.setup(menu.itemCount,menu.array);
            if (menu.item.hasMore) {
                  makeMenuNS(true,menuCount + "_" + menu.itemCount,menu,menu.item);
                  menu = menu.parentMenu;
            }
      }
      menu.lastItem = menu.item;
      menu.setup(isChild,parMenu,parItem);
}

function findTree(men){
      foundTree = false;
      for(i=11;i<men.array.length;i+=3){
            if(men.array[i]) {
                  foundTree = true;
                  break;
            }
      }
      return foundTree;
}

function setMenuTree(isChild,parMenu) {
      if (!isChild) {
            this.menuWidth = this.array[0] ? this.array[0] : menuWidth;
            this.menuLeft = this.array[1];
            this.menuTop = this.array[2];
            this.menuFontColor = this.array[3] ? this.array[3] : fntCol;
            this.menuFontOver = this.array[4] ? this.array[4] : overFnt;
            this.menuBGColor = this.array[5] ? this.array[5] : backCol;
            this.menuBGOver = this.array[6] ? this.array[6] : overCol;
            this.menuBorCol = this.array[7] ? this.array[7] : borCol;
            this.menuSeparatorCol = this.array[8] ? this.array[8] : separatorCol;
            this.treeParent = this;
            this.startChild = this;
            this.isTree = findTree(this);
      }
      else {
            this.menuWidth = parMenu.menuWidth;
            this.menuLeft = parMenu.menuLeft;
            this.menuTop = parMenu.menuTop;
            this.menuFontColor = parMenu.menuFontColor;
            this.menuFontOver = parMenu.menuFontOver;
            this.menuBGColor = parMenu.menuBGColor;
            this.menuBGOver = parMenu.menuBGOver;
            this.menuBorCol = parMenu.menuBorCol;
            this.menuSeparatorCol = parMenu.menuSeparatorCol;
            this.treeParent = parMenu.treeParent;
            this.isTree = parMenu.isTree;
      }

      this.maxItems = (isChild) ? this.array.length/3 : (this.array.length-9)/3;
      this.hasParent = isChild;
      this.setup = menuSetup;
      this.itemCount = 0;
}

function makeMenuIE(isChild,menuCount,parMenu) {
      menu = makeElement("elMenu" + menuCount);
      menu.array = eval("arMenu" + menuCount);
      menu.setMenuTree = setMenuTree;
      menu.setMenuTree(isChild,parMenu);
      menu.itemStr = "";
      
      while (menu.itemCount < menu.maxItems) {
            menu.itemCount++;
            status = "Creating Hierarchical Menus: " + menuCount + " / " + menu.itemCount;
            itemName = "item" + menuCount + "_" + menu.itemCount;

            arrayPointer = (isChild) ? (menu.itemCount-1)*3 :((menu.itemCount-1)*3)+9;
            dispText = menu.array[arrayPointer];
            hasMore = menu.array[arrayPointer + 2];

            if(IE5) {
                  newSpan = menuLoc.document.createElement("SPAN");
                  with(newSpan) {
                        id = itemName;
                        with(style) {
                              width = (menu.menuWidth-(borWid*2));
                              fontSize = fntSiz + "pt";
                              fontWeight = (fntBold) ? "bold" : "normal";
                              fontStyle = (fntItal) ? "italic" : "normal";
                              fontFamily = fntFam;
                              padding = itemPad;
                              borderBottomWidth = separator + "px";
                              borderBottomStyle = "solid";

//3.10.3 added conditional:
                              if(menu.isTree)      {
                                    if (isRight) paddingLeft = itemPad+fullImgSize;
                                    else paddingRight = itemPad+fullImgSize;
                              }
                        }
                        innerHTML = dispText;
                  }

                  newBreak = menuLoc.document.createElement("BR");
                  menu.appendChild(newSpan);
                  menu.appendChild(newBreak);

                  if(hasMore) {

//3.10.3 omitted next 2 statements:
//                        if (isRight) newSpan.style.paddingLeft = itemPad+fullImgSize;
//                        else newSpan.style.paddingRight = itemPad+fullImgSize;

                        newImage = menuLoc.document.createElement("IMAGE");
                        with(newImage){
                              src = imgSrc;
                              with(style) {
                                    position = "absolute";
                                    width = imgSiz;
                                    height = imgSiz;
                                    left = (isRight) ? itemPad : (newSpan.style.pixelWidth - itemPad - imgSiz);
                                    top = newSpan.offsetTop + itemPad + (isMac ? 0 : 2);
                              }
                        }
                        newSpan.appendChild(newImage);
                  }
            }
            else {
                  htmStr = (hasMore) ? imgStr + dispText : dispText;
                  menu.itemStr += "<SPAN ID=" + itemName + " STYLE=\"width:" + (menu.menuWidth-(borWid*2)) + "\">" + htmStr + "</SPAN><BR>";
            }
            if (hasMore) {
                  makeMenuIE(true,menuCount + "_" + menu.itemCount,menu);
                  menu = menu.parentMenu;
            }
      }

      if(!IE5) menu.innerHTML = menu.itemStr;

      itemColl = menu.children.tags("SPAN");
      for (i=0; i<itemColl.length; i++) {
            it = itemColl(i);
            it.setup = itemSetup;
            it.setup(i+1,menu.array);
      }
      menu.lastItem = itemColl(itemColl.length-1);
      menu.setup(isChild,parMenu);
}

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 {
            if (IE5) {
                  newDiv = menuLoc.document.createElement("DIV");
                  newDiv.style.position = "absolute";
                  newDiv.id = whichEl;
                  menuLoc.document.body.appendChild(newDiv);
            }
            else {
                  elStr = "<DIV ID=" + whichEl + " STYLE='position:absolute'></DIV>";
                  menuLoc.document.body.insertAdjacentHTML("BeforeEnd",elStr);
            }
            if (isFrames) eval(whichEl + "= menuLoc." + whichEl);
      }
      return eval(whichEl);
}

function itemSetup(whichItem,whichArray) {
      this.onmouseover = itemOver;
      this.onmouseout = itemOut;
      this.container = (NS4) ? this.parentLayer : this.parentElement;

      arrayPointer = (this.container.hasParent) ? (whichItem-1)*3 : ((whichItem-1)*3)+9;
      this.dispText = whichArray[arrayPointer];
      this.linkText = whichArray[arrayPointer + 1];
      this.hasMore = whichArray[arrayPointer + 2];

      if (IE4 && this.hasMore) {
            this.child = eval("elMenu" + this.id.substr(4));
            this.child.parentMenu = this.container;
            this.child.parentItem = this;
      }

      if (this.linkText) {
            if (NS4) {
                  this.captureEvents(Event.MOUSEUP)
                  this.onmouseup = linkIt;
            }
            else {
                  this.onclick = linkIt;
                  this.style.cursor = "hand";
            }
      }

      if (NS4) {
            htmStr = this.dispText;
            if (fntBold) htmStr = htmStr.bold();
            if (fntItal) htmStr = htmStr.italics();

            htmStr = "<FONT FACE='" + fntFam + "' POINT-SIZE=" + fntSiz + ">" + htmStr+ "</FONT>";
            this.htmStrOver = htmStr.fontcolor(this.container.menuFontOver);
            this.htmStr = htmStr.fontcolor(this.container.menuFontColor);
            if(this.hasMore) {
                  this.document.write(imgStr);
                  this.document.close();
            }
            this.visibility = "inherit";
            this.bgColor = this.container.menuBGColor;
            if (whichItem == 1) {
                  this.top = borWid + itemPad;
            }
            else {
                  this.top = this.prevItem.top + this.prevItem.clip.height + separator;
            }
            this.left = borWid + itemPad;
            this.clip.top = this.clip.left = -itemPad;
            this.clip.right = this.container.menuWidth-(borWid*2)-itemPad;
            maxTxtWidth = this.container.menuWidth-(borWid*2)-(itemPad*2);
            if (this.container.isTree) maxTxtWidth-=(fullImgSize);

            this.txtLyrOff = new Layer(maxTxtWidth,this);
            if (isRight && this.container.isTree) this.txtLyrOff.left = fullImgSize;
            this.txtLyrOff.document.write(this.htmStr);
            this.txtLyrOff.document.close();
            this.txtLyrOff.visibility = "inherit";

            this.clip.bottom = this.txtLyrOff.document.height+itemPad;

            this.txtLyrOn = new Layer(maxTxtWidth,this);
            if (isRight && this.container.isTree) this.txtLyrOn.left = fullImgSize;
            this.txtLyrOn.document.write(this.htmStrOver);
            this.txtLyrOn.document.close();
            this.txtLyrOn.visibility = "hide";

            this.dummyLyr = new Layer(100,this);
            this.dummyLyr.left = this.dummyLyr.top = -itemPad;
            this.dummyLyr.clip.width = this.clip.width;
            this.dummyLyr.clip.height = this.clip.height;
            this.dummyLyr.visibility = "inherit";
      }
      else {
            with (this.style) {
                  if(!IE5) {
                        fontSize = fntSiz + "pt";
                        fontWeight = (fntBold) ? "bold" : "normal";
                        fontStyle =   (fntItal) ? "italic" : "normal";
                        fontFamily = fntFam;
                        padding = itemPad;
                        borderBottomWidth = separator + "px";
                        borderBottomStyle = "solid";

//3.10.3 moved conditional here from below:

                         if (this.container.isTree && !this.hasMore) {
                              if (isRight) paddingLeft = itemPad+fullImgSize;
                              else paddingRight = itemPad+fullImgSize;
                        }

                  }

//3.10.3 moved conditional above
//                  if (this.container.isTree && !this.hasMore) {
//                        if (isRight) paddingLeft = itemPad+fullImgSize;
//                        else paddingRight = itemPad+fullImgSize;
//                  }

                  color = this.container.menuFontColor;
                  borderBottomColor = this.container.menuSeparatorCol;
                  backgroundColor = this.container.menuBGColor;
            }
      }
}  

function menuSetup(hasParent,openCont,openItem) {
      this.onmouseover = menuOver;
      this.onmouseout = menuOut;
      
      this.showIt = showIt;
      this.keepInWindow = keepInWindow;
      this.hideTree = hideTree
      this.hideParents = hideParents;
      this.hideChildren = hideChildren;
      this.hideTop = hideTop;
      this.hasChildVisible = false;
      this.isOn = false;
      this.hideTimer = null;

      this.childOverlap = (perCentOver != null) ? ((perCentOver/100) * this.menuWidth) : childOverlap;
      this.currentItem = null;
      this.hideSelf = hideSelf;
            
      if (hasParent) {
            this.hasParent = true;
            this.parentMenu = openCont;
            if (NS4) {
                  this.parentItem = openItem;
                  this.parentItem.child = this;
            }
      }
      else {
            this.hasParent = false;
      }

      if (NS4) {
            this.bgColor = this.menuBorCol;
            this.fullHeight = this.lastItem.top + this.lastItem.clip.bottom + borWid;
            this.clip.right = this.menuWidth;
            this.clip.bottom = this.fullHeight;
      }
      else {
            with (this.style) {
                  width = this.menuWidth;
                  borderWidth = borWid;
                  borderColor = this.menuBorCol;
                  borderStyle = borSty;
                  zIndex = topZ;
                  overflow = "hidden";
            }
            this.lastItem.style.border="";
            this.fullHeight = this.offsetHeight;
            if(isMac)this.style.pixelHeight = this.fullHeight;
            this.fullHeight = this.scrollHeight;
            this.showIt(false);
            this.onselectstart = cancelSelect;
            this.moveTo = moveTo;
            this.moveTo(0,0);
      }
}

function popUp(menuName,e){
      if (NS4 && NSresized) startIt();
      if (!isLoaded) return;
      linkEl = (NS4) ? e.target : event.srcElement;
      if (clickStart) linkEl.onclick = popMenu;
      if (!beingCreated && !areCreated) startIt();
      linkEl.menuName = menuName;  
      if (!clickStart) popMenu(e);
}

function popMenu(e){
      if (!isLoaded || !areCreated) return true;

      eType = (NS4) ? e.type : event.type;
      if (clickStart && eType != "click") return true;
      hideAll();

      linkEl = (NS4) ? e.target : event.srcElement;
      
      currentMenu = eval(linkEl.menuName);
      currentMenu.hasParent = false;
      currentMenu.treeParent.startChild = currentMenu;
      
      if (IE4) menuLocBod = menuLoc.document.body;
      if (!isFrames) {
            xPos = (currentMenu.menuLeft) ? currentMenu.menuLeft : (NS4) ? e.pageX : (event.clientX + menuLocBod.scrollLeft);
            yPos = (currentMenu.menuTop) ? currentMenu.menuTop : (NS4) ? e.pageY : (event.clientY + menuLocBod.scrollTop);
      }
      else {
            switch (navFrLoc) {
                  case "left":
                        xPos = (currentMenu.menuLeft) ? currentMenu.menuLeft : (NS4) ? menuLoc.pageXOffset : menuLocBod.scrollLeft;
                        yPos = (currentMenu.menuTop) ? currentMenu.menuTop : (NS4) ? (e.pageY-pageYOffset)+menuLoc.pageYOffset : event.clientY + menuLocBod.scrollTop;
                        break;
                  case "top":
                        xPos = (currentMenu.menuLeft) ? currentMenu.menuLeft : (NS4) ? (e.pageX-pageXOffset)+menuLoc.pageXOffset : event.clientX + menuLocBod.scrollLeft;
                        yPos = (currentMenu.menuTop) ? currentMenu.menuTop : (NS4) ? menuLoc.pageYOffset : menuLocBod.scrollTop;
                        break;
                  case "bottom":
                        xPos = (currentMenu.menuLeft) ? currentMenu.menuLeft : (NS4) ? (e.pageX-pageXOffset)+menuLoc.pageXOffset : event.clientX + menuLocBod.scrollLeft;
                        yPos = (currentMenu.menuTop) ? currentMenu.menuTop : (NS4) ? menuLoc.pageYOffset+menuLoc.innerHeight : menuLocBod.scrollTop + menuLocBod.clientHeight;
                        break;
                  case "right":
                        xPos = (currentMenu.menuLeft) ? currentMenu.menuLeft : (NS4) ? menuLoc.pageXOffset+menuLoc.innerWidth : menuLocBod.scrollLeft+menuLocBod.clientWidth;
                        yPos = (currentMenu.menuTop) ? currentMenu.menuTop : (NS4) ? (e.pageY-pageYOffset)+menuLoc.pageYOffset : event.clientY + menuLocBod.scrollTop;
                        break;
            }
      }

      currentMenu.moveTo(xPos,yPos);
      currentMenu.keepInWindow()
      currentMenu.isOn = true;
      currentMenu.showIt(true);

      return false;
}

function menuOver(e) {
      this.isOn = true;
      isOverMenu = true;
      currentMenu = this;
      if (this.hideTimer) clearTimeout(this.hideTimer);
}

function menuOut() {
      if (IE4) {
            theEvent = menuLoc.event;
            if (theEvent.srcElement.contains(theEvent.toElement)) return;
      }
      this.isOn = false;
      isOverMenu = false;

      menuLoc.status = "";
      if (!clickKill) allTimer = setTimeout("currentMenu.hideTree()",10);  
}

function itemOver(){
      if (keepHilite) {
            if (this.container.currentItem && this.container.currentItem != this) {
                  if (NS4) {
                        this.container.currentItem.bgColor = this.container.menuBGColor;
                        this.container.currentItem.txtLyrOff.visibility = "inherit";
                        this.container.currentItem.txtLyrOn.visibility = "hide";
                  }
                  else {
                        with (this.container.currentItem.style) {
                              backgroundColor = this.container.menuBGColor;
                              color = this.container.menuFontColor;
                        }
                  }
            }
      }

      if (IE4) {
            theEvent = menuLoc.event;
            if (theEvent.srcElement.tagName == "IMG") return;
            this.style.backgroundColor = this.container.menuBGOver;
            this.style.color = this.container.menuFontOver;
      }
      else {
            this.bgColor = this.container.menuBGOver;
            this.txtLyrOff.visibility = "hide";
            this.txtLyrOn.visibility = "inherit";
      }

      menuLoc.status = this.linkText;

      this.container.currentItem = this;

      if (this.container.hasChildVisible) {
            this.container.hideChildren(this);
      }

      if (this.hasMore) {
            horOffset = (isRight) ? (this.container.childOverlap - this.container.menuWidth) : (this.container.menuWidth - this.container.childOverlap);

            if (NS4) {
                  this.childX = this.container.left + horOffset;
                  this.childY = (this.pageY+this.clip.top) + childOffset;
            }
            else {
                  this.childX = this.container.style.pixelLeft + horOffset;
                  this.childY = this.offsetTop + this.container.style.pixelTop + childOffset + borWid;
            }

            this.child.moveTo(this.childX,this.childY);
            this.child.keepInWindow();
            this.container.hasChildVisible = true;
            this.container.visibleChild = this.child;
            this.child.showIt(true);
      }
}

function itemOut() {
      if (IE4) {
            theEvent = menuLoc.event;
             if (theEvent.srcElement.contains(theEvent.toElement)
        || (theEvent.fromElement.tagName=="IMG" && theEvent.toElement.contains(theEvent.fromElement)))
              return;
            if (!keepHilite) {
                  this.style.backgroundColor = this.container.menuBGColor;
                  this.style.color = this.container.menuFontColor;
            }
      }
      else {
            if (!keepHilite) {
                  this.bgColor = this.container.menuBGColor;
                  this.txtLyrOff.visibility = "inherit";
                  this.txtLyrOn.visibility = "hide";
            }
            if (!isOverMenu && !clickKill) {
                  allTimer = setTimeout("currentMenu.hideTree()",10);
            }
      }
}

function moveTo(xPos,yPos) {
      this.style.pixelLeft = xPos;
      this.style.pixelTop = yPos;
}

function showIt(on) {
      if (NS4) {
            this.visibility = (on) ? "show" : "hide";
            if (keepHilite && this.currentItem) {
                  this.currentItem.bgColor = this.menuBGColor;
                  this.currentItem.txtLyrOff.visibility = "inherit";
                  this.currentItem.txtLyrOn.visibility = "hide";
            }
      }
      else {
            this.style.visibility = (on) ? "visible" : "hidden";
            if (keepHilite && this.currentItem) {
                  with (this.currentItem.style) {
                        backgroundColor = this.menuBGColor;
                        color = this.menuFontColor;
                  }
            }
      }
      this.currentItem = null;
}

function keepInWindow() {
      scrBars = 20;
      botScrBar = (isFrames && navFrLoc=="bottom") ? (borWid*2) : scrBars;
      rtScrBar = (isFrames && navFrLoc=="right") ? (borWid*2) : scrBars;
      if (NS4) {
            winRight = (menuLoc.pageXOffset + menuLoc.innerWidth) - rtScrBar;
            rightPos = this.left + this.menuWidth;
      
            if (rightPos > winRight) {
                  if (this.hasParent) {
                        parentLeft = this.parentMenu.left;
                        newLeft = ((parentLeft-this.menuWidth) + this.childOverlap);
                        this.left = newLeft;
                  }
                  else {
                        dif = rightPos - winRight;
                        this.left -= dif;
                  }
            }

            winBot = (menuLoc.pageYOffset + menuLoc.innerHeight) - botScrBar ;
            botPos = this.top + this.fullHeight;

            if (botPos > winBot) {
                  dif = botPos - winBot;
                  this.top -= dif;
            }
            
            winLeft = menuLoc.pageXOffset;
            leftPos = this.left;

            if (leftPos < winLeft) {
                  if (this.hasParent) {
                        parentLeft = this.parentMenu.left;
                        newLeft = ((parentLeft+this.menuWidth) - this.childOverlap);
                        this.left = newLeft;
                  }
                  else {
                        this.left = 5;
                  }
            }
      }
      else {
             winRight = (menuLoc.document.body.scrollLeft + menuLoc.document.body.clientWidth) - rtScrBar;
            rightPos = this.style.pixelLeft + this.menuWidth;
      
            if (rightPos > winRight) {
                  if (this.hasParent) {
                        parentLeft = this.parentMenu.style.pixelLeft;
                        newLeft = ((parentLeft - this.menuWidth) + this.childOverlap);
                        this.style.pixelLeft = newLeft;
                  }
                  else {
                        dif = rightPos - winRight;
                        this.style.pixelLeft -= dif;
                  }
            }

            winBot = (menuLoc.document.body.scrollTop + menuLoc.document.body.clientHeight) - botScrBar;
            botPos = this.style.pixelTop + this.fullHeight;

            if (botPos > winBot) {
                  dif = botPos - winBot;
                  this.style.pixelTop -= dif;
            }
            
            winLeft = menuLoc.document.body.scrollLeft;
            leftPos = this.style.pixelLeft;

            if (leftPos < winLeft) {
                  if (this.hasParent) {
                        parentLeft = this.parentMenu.style.pixelLeft;
                        newLeft = ((parentLeft+this.menuWidth) - this.childOverlap);
                        this.style.pixelLeft = newLeft;
                  }
                  else {
                        this.style.pixelLeft = 5;
                  }
            }
      }
}

function linkIt() {
      if (this.linkText.indexOf("javascript:")!=-1) eval(this.linkText)
      else menuLoc.location.href = this.linkText;
}

function popDown(menuName){
      if (!isLoaded || !areCreated) return;
      whichEl = eval(menuName);
      whichEl.isOn = false;
      if (!clickKill) whichEl.hideTop();
}

function hideAll() {
      for(i=1; i<topCount; i++) {
            temp = eval("elMenu" + i + ".startChild");
            temp.isOn = false;
            if (temp.hasChildVisible) temp.hideChildren();
            temp.showIt(false);
      }  
}

function hideTree() {
      allTimer = null;
      if (isOverMenu) return;
      if (this.hasChildVisible) {
            this.hideChildren();
      }
      this.hideParents();
}

function hideTop() {
      whichTop = this;
      (clickKill) ? whichTop.hideSelf() : (this.hideTimer = setTimeout("if(whichTop.hideSelf)whichTop.hideSelf()",mSecsVis));
}

function hideSelf() {
      this.hideTimer = null;
      if (!this.isOn && !isOverMenu) {
            this.showIt(false);
      }
}

function hideParents() {
      tempMenu = this;
      while (tempMenu.hasParent) {
            tempMenu.showIt(false);
            tempMenu.parentMenu.isOn = false;      
            tempMenu = tempMenu.parentMenu;
      }
      tempMenu.hideTop();
}

function hideChildren(item) {
      tempMenu = this.visibleChild;
      while (tempMenu.hasChildVisible) {
            tempMenu.visibleChild.showIt(false);
            tempMenu.hasChildVisible = false;
            tempMenu = tempMenu.visibleChild;
      }

      if (!this.isOn || !item.hasMore || this.visibleChild != this.child) {
            this.visibleChild.showIt(false);
            this.hasChildVisible = false;
      }
}

function cancelSelect(){return false}

function reDo(){
      if (loader.innerWidth==origWidth && loader.innerHeight==origHeight) return;
      initVars();
      NSresized=true;
      menuLoc.location.reload();
}

function clicked() {
      if (!isOverMenu && currentMenu!=null && !currentMenu.isOn) {
            whichEl = currentMenu;
            whichEl.hideTree();
      }
}

window.onerror = handleErr;

function handleErr(){
      arAccessErrors = ["permission","access"];
      mess = arguments[0].toLowerCase();
      found = false;
      for (i=0;i<arAccessErrors.length;i++) {
            errStr = arAccessErrors[i];
            if (mess.indexOf(errStr)!=-1) found = true;
      }
      return found;
}

//end



Avatar of GwynforWeb
GwynforWeb
Flag of Canada image

posting code fragments is useless to tuse , please post a simple working version for IE or NS
Avatar of bandolex2
bandolex2

ASKER

this is a a simple working version for IE or NS and is the hole code of hirmenus.js

bandolex.
That looks pretty much obsolete.  The only Netscrap it appears to support is NS4, and most of the IE code is also 20th century except for a few snippets for IE 5.

Looks like a major re-write.

Cd&
>> hole code of hirmenus.js<

yes and know I now have to construct code around it just to test it. No thanks, gone to next question.
Your using this version:

v3.10.3 000731

The current version is 6.0.2

I would suggest you upgrade to a more recent version.

Cd&
the current version cost US$1000+ per domain, version 3 is free.

bandolex.
Then you probably need to either find a new free menu system, or start writing a new one.  What you have is well past any real usful life, and I doubt you are going to find an expert willing to invest the kind of time necessary to re-write it.

Cd&
Im thinking just a solution like this, but i dont know any javascript.

if browser=firefox then browser=netscape

That does not do a thing the netscrap code does not work for firefox.  It requires very different code from anything that I see in there.

Cd&
Just opting in for a third opinion, in case it adds credability (Even though cd& outranks me on any field I participate in) this code will not likely ever work in mozilla based browsers (like netscape 6 and firefox) unless you seriously rewrite it!
Netscape 6 and up runs on mozilla code but it doesn't come close (quite luckily) to netscape 4 compatibility.
If you seriously/desperately need to support netscape 4 it might be worth investigating this further, of not, there's a wonderfull world awaiting you:
http://www.htmldog.com/articles/suckerfish/
or
http://www.xs4all.nl/~peterned/csshover.html

Both of which are entiraly free and millenium proof ;).

Happy newyear,

  Martin
the menus looks very good and light, ill let you know when i make some testing
Have you gotten around to testing yet? Is there perhaps simething we could do to help you get things on the road?

 Martin
Martin,

I downloaded and tested the menus you show me, they're good but have some problems, for example you cannot put them on top or on the right because thay always open to the right.

This is for a content management system, so the user have alternatives to place the menu on the left, top or right so i don't think theyre apropiate.

In the other hand they use global styles for <A> and for <LI> what damages the rest of the page.

As i'm working in other aspects of the software i havent go deeply into the menus and left them for a later look, anyway if you know abou some other cross-browser (light) menú let me know.

I will be giving points anyway, but give me just a few more days.

bandolex2.
Hmmm, all the objections you mention can be easily fixed by modifying the styles that govern the menu's.
For instance when using this css in http://www.xs4all.nl/~peterned/examples/cssmenu.html
      #menu, #menu ul,#menu li,a {
            display:block;
            margin:0;
            padding:0;
            border:0;
      }

      #menu, #menu ul {
            width:150px;
            border:1px solid #9d9da1;
            background:white;
            list-style:none;
      }

      #menu li {
            position:relative;
            padding:1px;
            padding-left:26px;
            background:url("images/item_moz.gif") no-repeat;
            z-index:9;
      }
            #menu li.folder      { background:url("images/item_folder.gif") no-repeat; }            
            #menu.left li.folder ul {
                  position:absolute;
                  left:120px; /* IE */
                  top:5px;
            }            
                  #menu.left li.folder>ul { left:140px; } /* others */

      #menu a {
            padding:2px;
            border:1px solid white;
            text-decoration:none;
            color:gray;
            font-weight:bold;
            width:100%; /* IE */
      }
            #menu li>a { width:auto; } /* others */

      #menu li a.submenu {
            background:url("images/sub.gif") right no-repeat;
      }

      /* regular hovers */

      #menu a:hover {
            border-color:gray;
            background-color:#bbb7c7;
            color:black;
      }
            #menu li.folder a:hover {
                  background-color:#bbb7c7;
            }
      
      /* hovers with specificity */
      
      #menu li.folder:hover { z-index:10; }            
            
      #menu ul, #menu ul ul, #menu li:hover ul ul {
            display:none;
      }

      #menu li:hover ul, #menu li:hover li:hover ul {
            display:block;
      }            

      /*For right-side positioned menu*/
      #menu.right {
            float: right;
      }
            #menu.right li.folder ul {
                  position:absolute;
                  right:120px; /* IE */
                  top:5px;
            }            
                  #menu.right li.folder>ul { right:140px; } /* others */

You'd no longer be generally overruling all global styles in the page.
For testing this change the ul to include it's class as "left":
      <ul id="menu" class="left">
Or to see it on the right side (menu's opening to the left):
      <ul id="menu" class="right">

Many more variation could be created using these types of menu's.

 Martin

ASKER CERTIFIED SOLUTION
Avatar of mreuring
mreuring
Flag of Netherlands image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
sorry, i totaly forgot about this.
finaly i used tigra menu, but i learned that your suggested menus are great for other situations.

band.
I'm just glad you resolved it and happy I could help you along, if not specifically for this imediate problem :)