[Javascript] FW: Cannot access second line in Nav

Fri Jan 7 11:52:46 CST 2005

I'm modifying some javascript for a navigation bar.  The main navigation
is okay, but when you roll over the buttons it shows an additional line
with more options..Great.  However, one button (Human Resources-
Subglobal3) has numerous links that wraps around and creates two lines
of additional links.  The problem is that I cannot click on the second
line of links.  The line actually goes away when I roll over the line.  

Here is the actual code - it's an intranet site so I can't actually show
you the page, but I'll attach another document that uses the same code.
http://www.smnclassof1975.com/chris.cfm

Can someone help me out in helping me figure out how to access line two
if it wraps?

<script type="text/javascript">
<!--
var time = 3000;
var numofitems = 10;

//menu constructor
function menu(allitems,thisitem,startstate){ 
  callname= "gl"+thisitem;
  divname="subglobal"+thisitem;  
  this.numberofmenuitems = 10;
  this.caller = document.getElementById(callname);
  this.thediv = document.getElementById(divname);
  this.thediv.style.visibility = startstate;
}

//menu methods
function ehandler(event,theobj){
  for (var i=1; i<= theobj.numberofmenuitems; i++){
    var shutdiv =eval( "menuitem"+i+".thediv");
    shutdiv.style.visibility="hidden";
  }
  theobj.thediv.style.visibility="visible";
}

function closesubnav(event){
  if ((event.clientY <48)||(event.clientY > 107)){
    for (var i=1; i<= numofitems; i++){
      var shutdiv =eval('menuitem'+i+'.thediv');
      shutdiv.style.visibility='hidden';
    }
  }
}
// -->
</script>

</head>
<body onmousemove="closesubnav(event);"> 
<div class="skipLinks">skip to: <a href="#content">page content</a> | <a
href="../pageNav">links on this page</a> | <a href="#globalNav">site
navigation</a> | <a href="#siteInfo">footer (site information)</a>
</div>

<div id="masthead"> 

  <h1 id="siteName">OPNet</h1> 
  <div id="globalNav"> 
    <img alt=""
src="/Assets/Graphics/SiteWide/Navigation/gblnav_left.gif" height="32"
width="4" id="gnl"> <img alt=""
src="/Assets/Graphics/SiteWide/Navigation/glbnav_right.gif" height="32"
width="4" id="gnr"> 
    <div id="globalLink"> 
      <a href="CM_GB/index.cfm" id="gl1" class="glink"
onmouseover="ehandler(event,menuitem1);">City Manager</a>
      <a href="Finance/Index.cfm" id="gl2" class="glink"
onmouseover="ehandler(event,menuitem2);">Finance</a>
   <a href="Human_Resources/index.cfm" id="gl3" class="glink"
onmouseover="ehandler(event,menuitem3);">Human Resources</a>
   <a href="IT/Index.cfm" id="gl4" class="glink"
onmouseover="ehandler(event,menuitem4);">Info Tech</a>
   <a href="Law_Courts/index.cfm" id="gl5" class="glink"
onmouseover="ehandler(event,menuitem5);">Law/Court</a>
   <a href="Parks/Index.cfm" id="gl6" class="glink"
onmouseover="ehandler(event,menuitem6);">Parks</a>
   <a href="Planning/Index.cfm" id="gl7" class="glink"
onmouseover="ehandler(event,menuitem7);">Planning</a>
   <a href="#" id="gl8" class="glink"
onmouseover="ehandler(event,menuitem8);">Police</a> 
   <a href="Public_Works/index.cfm" id="gl9" class="glink"
onmouseover="ehandler(event,menuitem9);">Public Works</a>
   <a href="Fire/Index.cfm" id="g20" class="glink"
onmouseover="ehandler(event,menuitem10);">Fire</a>
    </div> 
    <!--end globalLinks--> 
  </div> 
  <!-- end globalNav --> 
  <div id="subglobal1" class="subglobalNav"> 
    <a href="CM_GB/CM_Home.cfm">CM Home</a> | 
 <a href="CM_GB/GovBody/index.cfm">Gov Body Home</a> | 
 <a href="CM_GB/Staff/Index.cfm">Contacts</a> | 
 <a href="CM_GB/Policies/Index.cfm">OP Policies</a> | 
 <a href="CM_GB/Media_Relations/index.cfm">Media</a> | 
 <a href="CM_GB/Switchboard/index.cfm">Switchboard</a> | 
 <a href="CM_GB/Leadership/Index.cfm">Leadership Forum</a> 
  </div> 
  <div id="subglobal2" class="subglobalNav"> 
    <a href="Finance/Contacts/Index.cfm">Contacts</a> | 
 <a href="Finance/Agendas/Index.cfm">Agendas</a> | 
 <a href="Finance/Minutes/Index.cfm">Meeting Minutes</a> | 
 <a href="Finance/Purchasing_Card/index.cfm">Purchasing</a> | 
 <a href="Finance/Travel/Index.cfm">Travel</a> | 
 <a href="Finance/Budget/Index.cfm">Budget</a> | 
 <a href="Office_Templates/index.cfm">Templates</a> 
  </div> 
  <div id="subglobal3" class="subglobalNav"> 
    <a href="Human_Resources/Contacts/Index.cfm">Contacts</a> | 
 <a href="Human_Resources/Employment/Index.cfm">Employment</a> | 
 <a href="Human_Resources/Payroll/Index.cfm">Payroll</a> | 
 <a href="Human_Resources/Payroll/Self_Service.cfm">HR Self-Service</a>
| 
 <a href="Human_Resources/Benefits/Index.cfm">Benefits/Comp.</a> | 
 <a href="Human_Resources/Retirement/Index.cfm">Retirement</a> | 
 <a href="Human_Resources/Safety/Index.cfm">Safety</a> | 
 <a href="Human_Resources/Training/Index.cfm">Training</a> |
 <a href="Human_Resources/Events/Index.cfm">Events</a> |
 <a href="Human_Resources/Programs/Index.cfm">Programs</a> |
 <a href="Human_Resources/Handbook/Index.cfm">Handbook</a> |
 <a href="Office_Templates/index.cfm">Templates</a> |
 <a href="mailto:werelist at opkansas.org">We're Listening</a>
  </div> 

<script type="text/javascript">
    <!--
      var menuitem1 = new menu(10,1,"hidden");
   var menuitem2 = new menu(10,2,"hidden");
   var menuitem3 = new menu(10,3,"hidden");
   var menuitem4 = new menu(10,4,"hidden");
   var menuitem5 = new menu(10,5,"hidden");
   var menuitem6 = new menu(10,6,"hidden");
   var menuitem7 = new menu(10,7,"hidden");
   var menuitem8 = new menu(10,8,"hidden");
   var menuitem9 = new menu(10,9,"hidden");
   var menuitem10 = new menu(10,10,"hidden");

    // -->
    </script> 

Chris Audano
City of Overland Park
Information Technology
913-895-6069
chris.audano at opkansas.org

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20050107/a734ac02/attachment.htm>