Fog Creek Software
Discussion Board

Knowledge Base
Terry's Tips
Darren's Tips

Current Menu Item - Again

I've read (at least I believe I have) what's been written here todate about different highlighting for the current item in the menu. I'm just wondering if any-one has come up with a better solution. I'd like to stick with; all menu items use the same CSS ID/class except the current one.

Basically I'd like to see (depending on which item is actually current of course) the following in the menu:
Item 1 - Anchor and normal color
Item 2 - Anchor and normal color
Item 3 - No Anchor and different color, it's current.
Item 4 - Anchor and normal color
Item 5 - Anchor and normal color

Even java-script will do ~ this site is laden with it and I'm not allowed to remove any of it. One more hunk won't hurt :)


Mr. E Lurker
Friday, July 9, 2004

Drat, lost my Mr E Lurker pseudonym, not paying attention. I liked that one too. Awww, you guys won’t tell will you :)

Perpetual Newbie II
Friday, July 9, 2004

PN, have you seen this one:

Friday, July 9, 2004

Yea tk your site (as always) was the first place I went to look for "how in hades do I do this with CD?" information. Having said that, in breezing through the article again I'm sure I felt a couple of synapses start firing ~ think I may have an idea :)

The problem is 'buttons'. I want to use some of the slick features of CSS but I've got buttons, semi-ugly buttons to boot. The owner likes them. I'll tinker, see if I can get that spark to fire again and see what happens.


Perpetual Newbie II
Friday, July 9, 2004

I use ASP/VBscript code to get the Current Menu Item effect throughout my site:

For anyone who's curious, here is a description of the approach:

Carmen Carter
Tuesday, July 13, 2004

Thanks for the reply, nice effect.

Can't use it though <sigh> CDScript, CSS or JavaScript.


Perpetual Newbie II
Tuesday, July 13, 2004

The technique mentioned here ( ) gives the exact same result as Boomtownwebworks above - only it's pure CityScript. If you are interested, PNII, I could publish the unfinished work for you to see.

Jorgen B.
Thursday, July 15, 2004


I did see this post before but shrugged it off because I like to avoid using CDScript 'keywordContains' and I also don't use tables - unless forced to. Shrugging off your script wasn't one of my brighter moments so I've coppied it out and I'll see if I can massage into what I *do* work with.

Unless it's changed from what you posted, seeing it in action isn't necessary ~ I'll play with it, see if I have any difficulty and post a request for help if it's required.

Thanks for the generous offer.

Perpetual Newbie II
Thursday, July 15, 2004

I don't know how you create your navigation menu.  One way is to make all index pages your section home pages and pull their headline, author, or other field for the navigation menu. 

Once you have a loop that creates your navigation menu, I think you could clone it into two loops: The first restricts the articles to thisArticle where you apply your special formatting.  The second restricts it to not thisArticle.

David Burch
Sunday, July 18, 2004


Thanks for the tip. Thoughts of using these script functions has rattled around in the grey matter but I've currently got too many irons in the fire and haven't looked at this site I'm doing in weeks. I'll keep this tips in mind,

Many thanks

Perpetual Newbie II
Monday, July 19, 2004

I just got it working for me (very pleased at the moment).

Jorgen - thanks very much for the spark

It's not tooo bad ...

(1) In each article that you want to include in this menu list, add a unique keyword (e.g. home, support, contact)

(2) In the template - for each article in the menu list you need 2 loops, one that has "thisArticle" and one that has a "not (thisArticle)"

If you've got 4 pages in your menu list then you're going to have 8 loops.

For each pair of loops insert the unique keyword as appropriate e.g.

{$foreach x in (and(keywordContains "home")(thisArticle))$}<a href="{$ $}" class="active">{$ x.filename $} </a>{$ next $}
{$foreach x in (and(keywordContains "home")(not (thisArticle)))$}<a href="{$ $}">{$ x.filename $} </a>{$ next $}

I did it this way to maintain the order in the menu list.
In the CSS I specify (abridged):

#nav a { background: #e7ebf7; }
#nav a:hover  { color: #000; background: #c6d3ef;}
#nav { color: #000; background: #fff; }

Here the background changes. I think that's what you were describing.

Wednesday, July 21, 2004

*  Recent Topics

*  Fog Creek Home