Whew... I found out how to get the submenu to be displayed when the parent of the submenu is selected when using the expandable menu.
NOTE: To my knowledge, this will only work if you have a dynamic way of adding adding a class to all <li> tags that are currently selected. In this case I chose to use the class "show-since-li-tag-is-active"
Use this CSS (The !important below may or may not be necessary, I was just being safe):
Code:
#udm li.show-since-li-tag-is-active ul {
position:relative !important;
display:block !important;
height:auto !important;
left:auto !important;
overflow:visible !important;
visibility:visible !important;
}
And here is the corresponding HTML menu when at url
http://www.domain.com/about-us/
Code:
<ul>
<li class="onclick">
<a href="/" onclick="document.location.href=this.href; return false;">Homepage</a>
</li>
<li class="onclick show-since-li-tag-is-active">
<a href="/about-us/" onclick="document.location.href=this.href; return false;">About Us</a>
<ul>
<li class="onclick">
<a href="/about-us/contact-info/" onclick="document.location.href=this.href; return false;">Contact Info</a>
</li>
</ul>
</li>
</ul>
Please let me know if there is a better way to find an active <li> tag potentially through the use of something in
udm-x-youarehere.js. I would really like a better way to do this.
This has been verified to work in FF3 and IE7 assuming I didn't do any typos here