ul li based menu - setting css class dynamically

I have the following nav menu:

How do I set the class of the anchor based on the current location?  Also, this should apply when browsing any subordinate pages, i.e. /foo/bar/default.aspx and /foo/bar/something.aspx should both set the current location in the nav menu.

Thanks,

Mark

You can do it a few ways, the easiest would be to write a loop that writes the html in, it will run through an array or something and if the url of that item matches the current url, itll put something like:

<li class="Active">...

Instead, then in your css you have

ul.MyMenu li a:hover, ul.MyMenu li.Active a
{
Styles
}

(Thats if you want the hover style and the 'active' style to look the same...

The alternative is to write a control that does this for you easier, using ListItem as the menu items or something (so that you don't totally recreate the wheel).

stevo_ wrote:

You can do it a few ways, the easiest would be to write a loop that writes the html in, it will run through an array or something and if the url of that item matches the current url, itll put something like...