Results 1 to 2 of 2

Thread: Tab menu malfunction

  1. #1
    Join Date
    Sep 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Tab menu malfunction

    I'm using a tab menu code (http://dynamicdrive.com/dynamicindex1/ddtabmenu.htm), and at first it worked fine. All of a sudden, it doesn't show the mouseover effects on first launch. It has to be reloaded at least once to work. What could be the problem?
    It might be useful to know that this code appears within another div; could that be the confusion? I'm not very familiar with layers and divs and such.


    HTML Code:
    <a onMouseover="showit(0)"><IMG SRC="1-horse.gif" ALT="The New Orleans legacy" border="0"></a>&nbsp;&nbsp; 
                <a onMouseover="showit(1)"><IMG SRC="2-band.gif" ALT="Our unique community" border="0"></a>&nbsp;&nbsp; 
                <a onMouseover="showit(2)"><IMG SRC="3-sky.gif" ALT="How we fit your business needs" border="0"></a>&nbsp;&nbsp; 
                <a onMouseover="showit(3)"><IMG SRC="4-balco.gif" ALT="A little something extra" border="0"></a> 
                <ilayer width=550 height=30 name="dep1" bgColor="cccccc">
    <layer name="dep2" width=550 height=30>
    </layer>
    </ilayer>
    <div id="describe" style="background-color:cccccc;width:550px;height:30px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>
    
    
    <script language="JavaScript1.2">
    /*
    Tabs Menu (mouseover)- By Dynamic Drive
    For full source code and more DHTML scripts, visit [url]http://www.dynamicdrive.com[/url]
    This credit MUST stay intact for use
    */
    var submenu=new Array()
    
    submenu[0]='<b><a href="">A quick tour of our rich history...</a></b>'
    submenu[1]='<b><a href="">The People</a> | <a href="">A Regional Profile</a> | <a href="">How We Compare</a></b>'
    submenu[2]='<b><a href="">Reasons to Relocate</a> | <a href="">Local Incentives</a> | <a href="">Start-up Contacts</a> | <a href="">Regional Real Estate</a></b>'
    submenu[3]='<b><a href="">Whats Happening</a> | <a href="">Other <i>New Orleans Works</i> Portals</a> | <a href="">Search</a> | <a href="">About Us</a></b>'
    
    var delay_hide=200
    
    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;
    }
    
    </script>

  2. #2
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Well, the script runs in IE for me, though in Mozilla, there's something wierd. It seems you need to have some content- any content- following the container DIV tag in order to get it to work. So right after the DIV tag:

    Code:
    <div id="describe" style="background-color:cccccc;width:550px;height:30px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>
    
    Some text.
    I'm not sure why this is the case yet, though for now, doing the above will work in Mozilla/NS.

Bookmarks

Posting Permissions

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