Showing arrows on multi-level menu

I am trying to show arrows on a multi-level menu (site is
http://www.sallekiss.org.uk).

Where we have a multi-level item the list structure looks like:

<ul class="menu">
<li class="parent"><a>...</a></li>
</ul>

when the top level is closed and

<ul class="menu">
<li class="parent active"><a>...</a>
<ul>
<li><a>...</a></li>
</ul>
</li>
</ul>

when it is open.

When we have an active, single level menu item we also have

<ul class="menu">
<li class="active"><a>...</a></li>
</ul>

Now I can use the parent class to put an arrow on without any problem. The
questions are:

1. How do I change the arrow when we have an active parent?
2. How do I avoid putting an arrow on something that is active,
but not a parent?

I only go to two levels, so a general case solution isn't required.

--
Colin Walls

Colin Walls wrote:

I am trying to show arrows on a multi-level menu (site is
http://www.sallekiss.org.uk).

Where we have a multi-level item the list structure looks like:

ul class="menu"
li class="parent"><a>...</a></li
/ul

when the top level is closed and

ul class="menu"
li class="parent active"><a>...</a
ul
li><a>...</a></li
/ul
/li
/ul

when it is open.

When we have an active, single level menu item we also have

ul class="menu"
li class="active"><a>...</a></li
/ul

Now I can use the parent class to put an arrow on without any problem. The
questions are:

1. How do I change the arrow when we have an active parent?
2. How do I avoid putting an arrow on something that is active,
but not a parent?

I only go to two levels, so a general case solution isn't required.

I used a "has children" class which on my page is "kids". The arrow is a
background image on the A element. If this is what you are looking for
then take a peek at my sites css "mm.css" and the source and borrow what
you need.


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com