View Single Post
Unread 11-06-2008, 07:49 PM
colech colech is offline
Junior Member
Join Date: Nov 2008
Posts: 20
  #7  
Default

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
Reply With Quote