PHP menu code for setting active tab on php menu includes

I have a menu system that is included on each page of my site and to display the active tab on a particular page the below code is used.

However there is one problem with it. If the page is in another folder, then all the pages within the folder have to be listed in the code which is really annoying.

Can someone help me change it so I only have to list the directory rather than all the pages in it as well.

Here is the code:

<script type="text/javascript">
var mouse,b;
function onmouse(mouse,b)
{
  var ss;
    ss=b+'/'+mouse+'_on.gif';
  document[mouse].src=ss;
}
var out,b;
function onout(out,b)
{
 var ss;
 ss=b+'/'+out+'_rel.gif';
 document[out].src=ss;
}
</script>
<? $a=$_SERVER['REQUEST_URI']; 
  if($a=='/bigfreebet/bettingodds/index.php' || $a=='/bigfreebet/bettingodds/')
  {
  $flo='../images/menu';
  $fol='../images/menu';
  }
  else
  {
  $flo='images/menu';
  $fol='images/menu';
  }
?>
<div id="menu_main"> 
    <ul id="menutopmain" >
	  <li>
	  <? if($a=='/bigfreebet/' || $a=='/bigfreebet/index.php') { ?><img src="<? echo $flo;?>/onhome.gif" width="50" height="25"><? } else {?>
	  <a href="/bigfreebet/index.php" onMouseOver="onmouse('home','<? echo $flo;?>')" onMouseOut="onout('home','<? echo $flo;?>')"><img src="<? echo $flo;?>/home.gif" name="home"  width="50" height="25" border="0"></a> <? }?>
	  </li>
	  <li> <img src="<? echo $fol;?>/cross.png"> </li>
      <li>
	 <? if($a=='/bigfreebet/bettingodds/index.php' || $a=='/bigfreebet/bettingodds/') { ?><img src="<? echo $flo;?>/onbettingodds.gif" width="90" height="25"><? } else {?>
	  <a href="/bigfreebet/bettingodds/" onMouseOver="onmouse('bettingodds','<? echo $flo;?>')" onMouseOut="onout('bettingodds','<? echo $flo;?>')"><img src="<? echo $flo;?>/bettingodds.gif" name="bettingodds"  width="90" height="25" border="0"></a><? } ?></li>
	   <li> <img src="<? echo $fol;?>/cross.png"> </li>

   <li>
	 <? if($a=='/bigfreebet/bettingodds/index.php' || $a=='/bigfreebet/freebets.php') { ?><img src="<? echo $flo;?>/onfreebets.gif" width="71" height="25"><? } else {?>
	  <a href="/bigfreebet/freebets.php" onMouseOver="onmouse('freebets','<? echo $flo;?>')" onMouseOut="onout('freebets','<? echo $flo;?>')"><img src="<? echo $flo;?>/freebets.gif" name="freebets"  width="71" height="25" border="0"></a><? } ?></li>
	   <li> <img src="<? echo $fol;?>/cross.png"> </li>


 <li>
	 <? if($a=='/bigfreebet/bettingodds/index.php' || $a=='/bigfreebet/freebets.php') { ?><img src="<? echo $flo;?>/onforum.gif" width="50" height="25"><? } else {?>
	  <a href="/bigfreebet/forum.php" onMouseOver="onmouse('forum','<? echo $flo;?>')" onMouseOut="onout('forum','<? echo $flo;?>')"><img src="<? echo $flo;?>/forum.gif" name="forum"  width="50" height="25" border="0"></a><? } ?></li>
	   <li> <img src="<? echo $fol;?>/cross.png"> </li>


 <li>
	 <? if($a=='/bigfreebet/bettingodds/index.php' || $a=='/bigfreebet/freebets.php') { ?><img src="<? echo $flo;?>/onpreviews.gif" width="65" height="25"><? } else {?>
	  <a href="/bigfreebet/forum.php" onMouseOver="onmouse('previews','<? echo $flo;?>')" onMouseOut="onout('previews','<? echo $flo;?>')"><img src="<? echo $flo;?>/previews.gif" name="previews"  width="65" height="25" border="0"></a><? } ?></li>
	   <li> <img src="<? echo $fol;?>/cross.png"> </li>

      <li>
	  <? if($a=='/bigfreebet/contact.php') { ?><img src="<? echo $flo;?>/oncontact.gif" width="61" height="25"><? } else {?>
	  <a href="/bigfreebet/contact.php" onMouseOver="onmouse('contact','<? echo $flo;?>')" onMouseOut="onout('contact','<? echo $flo;?>')"><img src="<? echo $flo;?>/contact.gif" name="contact" width="61" height="25" border="0"></a><? } ?></li>
    </ul>
</div>

Code (markup):

 

Dunno how to fix your existing script, but there is a way easier way to do this.

If you set a separate ID for each item in the menu, for instance if your menu look like this:

<ul id="mainmenu">
  <li><a href="http://yoursite.com" id="main">Homepage</a></li>
  <li><a href="http://yoursite.com/contact" id="contact">Contact us</a><li>
</ul>

Code (markup):

and on the <body> of each page you add an ID too, like this:

<!-- this would be the id of the index.php -->
<body id="index_pg">
<!-- and this would be the id of the contact.php -->
<body id="contact_pg">

Code (markup):

If you do this, you will have matchin pairs of IDs - like this:
#index_pg #mainpage, #contact_pg #contact

If you then use these matching pairs in your CSS-file, simliar to this:

#index_pg #mainpage, #contact_pg #contact {
  color: red;
  }

Code (markup):

The menu-items will be colored red when they're matching the pairs, and elsewise be whatever color you use for your menu.

Can be expanded indefinitely, and can also be styled however you want, and there is noe javascript involved.

Apart from the values in the CSS-file, every ID-value can be dynamically assigned by PHP, and therefore the only thing you need to worry about is the adding of them to the CSS-file.

 

Hi there,

I followed you, but in my index.php there is a notice: Parse error: syntax error, unexpected... in line ...

In php is <body> not allowed to use?

There is no problem with my header and CSS-file.

 

Well, you will have to mix PHP and regular HTML - whatever way you chose to do that is up to you.

Unless you paste the code from the file, it's hard to say exactly what's wrong, but you've probably used a tag directly in PHP - which will break it.

If you want to use PHP by "itself" and write HTML just as you normally do, you'll have to stop and start the PHP-script between each iteration of HTML - like this:

<?php
//some PHP code here
?>
<p>This is some HTML-code</p>
<?php
//more PHP code
?>

or, you can tell PHP to echo the HTML, like this:
<?php
//some PHP code
echo "<p>Some HTML Code here</p>";
//some more PHP code here
?>

 

Thank u,

I managed to do it.

regards.