UDM won't display submenus

One of the more frequently asked questions I receive about the UDM menu is often about the menu not properly expanding submenus.

The UDM menu is designed to work with properly nested <ul> and <li> tags. If these tags are not properly nested, the UDM menu (either CSS or javascript) will not be able to properly access the right elements when you hover over a list item. Thus, the menu appears to not work.

The most common problem is closing a <li> tag too early.

Example:

<ul id="udm" class="udm">
    <li><a href="/">Home</a></li>
    <ul>
        <li><a href="/page.html">Sub page</a></li>
    </ul>
</ul>

In the example above, the sub page link, is properly nested in a <ul> <li> combination, but there is a closing </li> before the sub page link. The correct placement should be like this:

<ul id="udm" class="udm">
    <li><a href="/">Home</a>
        <ul>
            <li><a href="/page.html">Sub page</a></li>
        </ul>
    </li>
</ul>

There are several online resources that can help you identify such problems. One of the better ones is the W3C validator available here:

http://validator.w3.org

Using this tool should help with 95% or more of these types of issues.

[colech]

FOR EXPANDING MENUS:

When creating expanding menus, another thing that is easy to overlook is that the class, "onclick" needs to be added to all <li> tags like this:

<ul id="udm" class="udm">
    <li class="onclick"><a href="/">Home</a></li>
    <ul>
        <li class="onclick"><a href="/page.html">Sub page</a></li>
    </ul>
</ul>