Dynamic CSS PHP Menu for “you’re here” effect
-
I found this simple and elegant solution to showing “current page” in a tabbed menu through use of CSS. The menu will add id=current_page to the unordered list item if it matches the name of the current page.
I got it to work with static php pages, but not when it includes a WordPress page that uses “/?page_id=3” or “/?p=3”.
Can anybody look at this and see if you can get it to work?
<?php$nav_options = array(
"Home" => "/index.php",
"Blog" => "/blog/index.php",
"News" => "/news/index.php",
"Resume" => "/resume/index.php",
"Past Work" => "/portfolio/index.php",
"Articles" => "/articles/index.php",
"Downloads" => "/programming/index.php",
"Links" => "/links/index.php"
);// define our current location
$current_url = $_SERVER['PHP_SELF'];// begin the navigation div and the top of the UL
print("<!-- begin menu include -->
<div id=\"navcontainer\">n
<ul id=\"navlist\">n");// tabindex is set to "2" here, because my "skiplink" is set as "1"
// more information on a skiplink can be found at
// http://www.wac.ohio-state.edu/tutorials/section508/skipnav.htm
// more information on tabindex can be found at
// http://www.w3.org/TR/html401/interact/forms.html#adef-tabindex
$tabindex = 2;// start the loop to display the options
foreach($nav_options as $key => $val){// if the destination is NOT the same as the current location, make a link
if($val != $current_url){
print("<li><a href=\"$val\" tabindex=\"$tabindex\">$key</a> </li>");
$tabindex++; // increment tabindex here
}
// otherwise, this means that the destination of the link is the same as current location
// in which case we DO NOT want to create a link
else{
print("<li class=\"curr_loc\">$key</li>");
}
} // clode the foreach loop// close the navbar
print("</ul>");
print("</div><!-- end menu include -->");?>
- The topic ‘Dynamic CSS PHP Menu for “you’re here” effect’ is closed to new replies.