Joomla 1.5 correctly makes menus into lists. Nested menus contain
sublists. They also attach a mixture of classes and id's, but I don't
think they do this particularly well. 

What I want to do is fairly simple: 

1. A leaf menu item will have display in a simple box, 
   the background will change on hover. The visited 
   item will appear the same as the unvisited item. 

2. A parent menu item will have the same appearance 
   as the leaf menu item with the addition of an 
   arrow on the RHS. If the parent is not active, 
   i.e. unexpanded it will have a right arrow, if 
   it is expanded it will have a down arrow. 

Now the backgrounds are fairly simple, they can just be done with the
pseudo classes on the <a> tag. If you look at the code below I can get
the right arrow by using the "parent" class. However, I can't work out
the way to switch it to the down arrow. Note that changing the emitted
HTML from Joomla is not an option. The only other possible case not
shown below is a leaf node that has the class "active" 

<ul class="menu"> 
  <li class="item1"> <!-- Leaf note, inactive --> 
    <a href="#"><span>Home</span></a> 
  </li> 

  <li id="current" class="parent active item53"> <!-- Active parent --> 
    <a href="#"><span>About the Club</span></a> 
    <ul> 
      <li class="item72"> 
    <a href="#"><span>Documents</span></a> 
      </li> 
    </ul> 
  </li> 

  <li class="parent item74"> <!-- Inactive parent --> 
    <a href="#"><span>The Schools Programme</span></a> 
  </li> 
</ul> 

-- 
Colin Walls
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to