65.9K
CodeProject is changing. Read more.
Home

Dynamic Navigation Menus

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.18/5 (11 votes)

Mar 11, 2010

CPOL
viewsIcon

17094

Next code demonstrates how to build a simple menu function with the current page high-lighted.index.phpPage - .inactive,...

Next code demonstrates how to build a simple menu function with the current page high-lighted. index.php
<?php
require_once('menu.php');
$page = isset($_GET['page']) ? $_GET['page'] : 'home';
?>
<html>
<head>
<title>Page - <?=$page?></title>
<style type="text/css">
.inactive, .active
{
 padding:2px 2px 2px 20px;
}
.inactive
{
 background:#ddd;
}
.active
{
 background:black;
 font-weight:bold;
}
.inactive a
{
 text-decoration:none;
}
.active a
{
 text-decoration:none;
 color:white;
}
</style>
</head>
<body>
<table>
<tr>
<td width="200" valign="top">
<?php page_menu($page); ?>
</td>
<td width="600" valign="top">
Page: <?=$page?>
</td>
</tr>
</table>
</body>
</html>
menu.php
<?php
function menu_item($id, $title, $current)
{
  $class = ($current == $id) ? "active" : "inactive";
?>
  <tr><td class=<?=$class?>>
  <a href="index.php?page=<?=$id?>"><?=$title?></a>
  </td></tr>
<?php
}
function page_menu($page)
{
?>
  <table width="100%">
  <?php menu_item('home', 'Home', $page); ?>
  <?php menu_item('about', 'About', $page); ?>
  <?php menu_item('browse', 'Browse', $page); ?>
  <?php menu_item('download', 'Download', $page); ?>
</table>
<?php
}
?>