Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jan 2004
    Location
    Des Moines, Iowa
    Posts
    219
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Insanity is Approaching - Please Help!

    Ok ladies and gents...

    Let the smart people come out of the woodwork!! <PLEASE!>

    link is: http://www.trinitylifedsm.org

    I'll give you the code here as well and explain the problem

    I haven't included the whole code but you can view my page at the above link to get the full idea.

    Now - the problem as you will soon find after visiting the link is that if you mouseover the top nav menu a submenu will appear... HOWEVER, if you try to go to the submenu(sometimes you will make it sometimes you won't) it goes away... You can sometimes get to one of the submenu links but try to go to another one... It goes away. PLEASE SOMEONE HELP BEFORE I ADMIT MYSELF TO A MENTAL HOSPITAL!


    This is the code that handles the menu and creates the submenu.
    <script type="text/javascript">
    <!--
    var time = 50000;
    var numofitems = 7;

    //menu constructor
    function menu(allitems,thisitem,startstate){
    callname= "gl"+thisitem;
    divname="subglobal"+thisitem;
    this.numberofmenuitems = 7;
    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(){
    for (var i=1; i<= numofitems; i++){
    window['menuitem'+i].thediv.style.visibility='hidden';
    }
    }
    // -->
    </script>

    This how I'm handling the mouseover on the main menu (by the way this is all CSS positioned)
    <div id="globalNav">
    <img alt="" src="images/gblnav_left.gif" height="32" width="5" id="gnl"> <img alt="" src= "images/glbnav_right.gif" height="32" width="5" id="gnr">
    <div id="globalLink">
    <a href="#" id="gl1" class="glink" onmouseover="ehandler(event,menuitem1);">Home</a>
    <a href="#" id="gl2" class="glink" onmouseover="ehandler(event,menuitem2);">About TLC</a>
    <a href="#" id="gl3" class="glink" onmouseover="ehandler(event,menuitem3);">Ministries</a>


    [B]This is how I'm handling the onmouseout of the div layers that hold the submenus.[B]
    <DIV id="subglobal" onmouseout="closesubnav(event);">
    <div id="subglobal1" class="subglobalNav">
    <a href="#">subglobal1 link</a> | <a href="#">subglobal1 link</a>
    </div>
    <div id="subglobal2" class="subglobalNav">
    <a href="#">subglobal2 link</a> | <a href="#">subglobal2 link</a> | <a href="#">subglobal2
    link</a> | <a href="#">subglobal2 link</a> | <a href="#">subglobal2 link</a> | <a href="#">subglobal2
    link</a> | <a href="#">subglobal2 link</a>
    </div>
    <div id="subglobal3" class="subglobalNav">
    <a href="#">subglobal3 link</a> | <a href="#">subglobal3 link</a> | <a href="#">subglobal3
    link</a> | <a href="#">subglobal3 link</a> | <a href="#">subglobal3 link</a> | <a href="#">subglobal3
    link</a> | <a href="#">subglobal3 link</a>
    </div>
    Rich S. Wyatt
    D3 Web Creations

  • #2
    New Coder
    Join Date
    Jul 2003
    Location
    Houston, Texas
    Posts
    58
    Thanks
    0
    Thanked 0 Times in 0 Posts
    didn't have much time to review your code but here is an aexample of one I use all the time and it has never failed me yet. I hope this will help you.

    <form name="slect_region" action="aud_something.php" method="post">
    <body bgcolor="#336699" onload="goforit()" link="#123456" alink="#123456" vlink="#123456">
    <table width="100%" bgcolor="#336699" border="3" cellspacing="2" bordercolor="#eeeeff" rules="groups"
    bordercolorlight="#eeeeff" bordercolordark="#eeeeff">

    <tr>
    <td colspan="7" align="center" class="hd_class">MARINER HEALTH CARE, INC.</td>
    </tr>

    <tr>
    <td colspan="7" align="center" class="hd_class">AUDIT SCORE CARD - MAIN MENU</td>
    </tr>

    <tr>
    <td class="td_class">&nbsp</td>
    <tr>

    <!--Links used to initiate the sub menus. Pass in the desired submenu index numbers (ie: 0, 1) -->
    <tr>
    <td align="center" class="td_class" valign="center">
    <a onMouseover="showit(0)"><img src="doc_item.png">&nbsp;&nbsp;New Survey</a>&nbsp;&nbsp;<img src="doc_item.png">&nbsp;&nbsp;</img><a onMouseover="showit(1)">Existing Survey&nbsp;&nbsp;</a><img src="doc_item.png">&nbsp;&nbsp;</img><a onMouseover="showit(2)">Description Maint.</a></td>
    </tr>

    <tr>
    <td class="td_class">&nbsp</td>
    <tr>

    <tr align="center" class="td_class">
    <td><ilayer width=800 height=32 name="dep1" bgColor="#eeeeff" color="#123456"><layer name="dep2" width=800 height=32></layer>
    </ilayer>
    <!-- Edit the dimensions of the below, plus background color-->
    <span id="describe" style="color:#123456; background-color:#eeeeff;width:800px;height:32px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></span>
    </td>
    </tr>
    </table>
    <script language="JavaScript1.2">

    /*
    Tabs Menu (mouseover)- By Dynamic Drive
    For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
    This credit MUST stay intact for use
    */

    var submenu=new Array()

    //Set submenu contents. Expand as needed. For each content, make sure everything exists on ONE LINE. Otherwise, there will be JS errors.


    submenu[0]='<font size="4" face="Arial" color="#123456"><b><a href="aud_new_survey.php">Select Facility</a>'

    submenu[1]='<font size="4" face="Arial" color="#123456"><b><a href="aud_exist_survey.php">Select Facility</a>'

    submenu[2]='<font size="4" face="Arial" color="#123456"><b><a href="aud_desc_maint.php?action=add">Add New Description</a> | <a href="aud_desc_maint.php?action=change&pass=1">Change a Description</a> | <a href="aud_desc_maint.php?action=delete&pass=1">Delete a Description</a>'

    submenu[3]='<font size="4" face="Arial" color="#123456"><b><a href="aud_pnt_maint.php?action=add">Add New Points</a> | <a href="aud_pnt_maint.php?action=change">Change a Point</a> | <a href="aud_pnt_maint.php?action=delete">Delete a Point</a>'

    //Set delay before submenu disappears after mouse moves out of it (in milliseconds)
    var delay_hide=500

    /////No need to edit beyond here

    var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""

    function showit(which){
    clear_delayhide()
    thecontent=(which==-1)? "" : submenu[which]
    if (document.getElementById||document.all)
    menuobj.innerHTML=thecontent
    else if (document.layers){
    menuobj.document.write(thecontent)
    menuobj.document.close()
    }
    }

    function resetit(e){
    if (document.all&&!menuobj.contains(e.toElement))
    delayhide=setTimeout("showit(-1)",delay_hide)
    else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
    delayhide=setTimeout("showit(-1)",delay_hide)
    }

    function clear_delayhide(){
    if (window.delayhide)
    clearTimeout(delayhide)
    }

    function contains_ns6(a, b) {
    while (b.parentNode)
    if ((b = b.parentNode) == a)
    return true;
    return false;
    Beyond a critical point within a finite space, freedom diminishes as numbers increase. ...The human question is not how many can possibly survive within the system, but what kind of existence is possible for those who do survive."


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •