Hi guys,

 

I am using CSS to highlight the current page in my navigation system using id="unique_id" in the body tag.

 

This is fine for simple navigation, but if you need to highlight 2 menu items (the parent and child for example), how would you go about it?

 

If your structure (and menu system) was:

 

SECTION A

- Subsection A1

- Subsection A2

SECTION B

- Subsection B1

- Subsection B2 *

 

And on the * page you wanted to CSS highlight both the SECTION B and Subsection B2 menu items individually, how would you do it?

 

I am using PHP, so if there is a PHP way of doing it that is easier than using IDs, then I am all ears

 

Many thanks,

 

Martin

I'm not a PHP developer, but the theory behind it would be that you assign a class of "active" to the current active tab and, if you want to differentiate between active and parent, a "parent" class to the parent items. Then setup CSS classes with the setting for the active and parent items.

 

Rick.

Something like this may work:

<?php
$curPageName=substr($_SERVER["SCRIPT_NAME"],strrpos($_SERVER["SCRIPT_NAME"],"/")+1);
?>
<h3>Navigation</h3>
<ul id="nav">
<li<?php if($curPageName=='page1.php'){echo ' class="active"';}?>><a href="page1.php">Page 1</a></li>
<li<?php if($curPageName=='page2.php' || $curPageName=='page2a.php'){echo ' class="active"';}?>><a href="page2.php">Page 2</a>
<ul>
<li<?php if($curPageName=='page2a.php'){echo ' class="active"';}?>><a href="page2a.php">Page 2a</a></li>
</ul></li>
<li<?php if($curPageName=='page3.php'){echo ' class="active"';}?>><a href="page3.php">Page 3</a></li>
<li<?php if($curPageName=='page4.php'){echo ' class="active"';}?>><a href="page1.php">Page 4</a></li>
</ul>

#nav li.active {font-weight:bold;} //whatever your style for active list item...

Thanks!!