CODEWITHSUNDEEP
javascripthtmlcssdrop-down-menu
Mack
Mack

Reputation: 33

Drop down menu not dropping

I am attempting a simple drop down menu using Javascript but when I hover over my link that should display my drop down menu nothing happens. What do you think is wrong with my Javascript?

Javascript:

function onHover( divID )
    {
        var div = document.getElementByID( divID );

        if (div)
        {
            div.className = "unHidden";
        }
    }

    function onLeave( divID ) 
    {
        var div = document.getElementByID( divID );

        if (div)
        {
            div.className = "hidden";
        }
    }

My css:

.hidden { visibility: hidden; }
.unHidden { visibility: visible; z-index: 30; }

And finally my HTML:

<li>
<a onmouseover="onHover('otherLinks)" onmouseout="onLeave('otherLinks')">Other Links</a>
<div class="hidden" id="otherLinks" onmouseover="onHover('otherLinks)" onmouseout="onLeave('otherLinks')">
    <ul>
    <li><a href="events.html">Events</a></li>
    <li><a href="foodNutrition.html">Food & Nutrition</a></li>
    <li><a href="faq.html">FAQ</a></li>
    </ul>
</div>
</li>

Upvotes: 0

Views: 715

Answers (4)

Dan
Dan

Reputation: 10351

Is there any reason why you're using Javascript for your drop downs and not HTML and CSS?

Son of suckerfish drop downs is a good place to start for a HTML and CSS drop down option: http://htmldog.com/articles/suckerfish/dropdowns/

Upvotes: 10

GatoPresto
GatoPresto

Reputation: 108

You can only use css. Or use the library JQuery.

Upvotes: 0

Eddie Flores
Eddie Flores

Reputation: 1103

It is document.getElementById( divID );, note that it is "Id" not "ID". You are also missing a single quote, it should be onmouseover="onHover('otherLinks')". I also agree with Dan's answer.

Upvotes: 3

Muhammad Zeeshan
Muhammad Zeeshan

Reputation: 8856

May be this is the issue: You have passed the div name like

onmouseover="onHover('otherLinks)"

Try to give the div name like

onmouseover="onHover('otherLinks')"

or try java script ddl

Upvotes: 1

Related Questions