javascript - 下拉菜单不下降

Question

我正在尝试使用 Javascript 制作一个简单的下拉菜单，但是当我将鼠标悬停在应该显示我的下拉菜单的链接上时，没有任何反应。你认为我的 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";
        }
    }

我的CSS:

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

最后是我的 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>

Answer 1

您使用 Javascript 而不是 HTML 和 CSS 的下拉菜单有什么原因吗？

Son of suckerfish drop downs 是开始使用 HTML 和 CSS 下拉选项的好地方:http://htmldog.com/articles/suckerfish/dropdowns/