Menu: Knop oplichten als hij actief is

[nerd111]

Beste allemaal,

weten jullie een script waarbij de menuknop voor de pagina waarop je je op dat moment bevindt, kleurt of iig veranderd?

Mvg!

[Remi]

Ligt er aan hoe je menu systeem in elkaar zit. Als je daar iets meer uitleg over kan geven.

[nerd111]

Het is zo opgebouwd:

<ul><li>....</li><li>.....</li></ul>

[Stef]

Code: Selecteer alles

<?php if ( $_GET == "waar-ik-nu-ben" ) { echo 'actief'; } ?>

[nerd111]

Dat begrijp ik niet helemaal ... Zou u het aub kunnen uitleggen (de code)?

[Derk]

Doe anders even een link naar je site plaatsen. Dat helpt.

[Stef]

Dat begrijp ik niet helemaal ... Zou u het aub kunnen uitleggen (de code)?

Tuurlijk, om iets actief te krijgen zul je eerst moeten weten dat de persoon op de pagina zit. Allereerst zoek je dus uit of pagina "waar-ik-nu-ben" overeenkomt met de pagina die is opgevraagd. Als dat zo is, dan kun je dus dingen laten doen of verschijnen. In mijn geval echo't ie "actief".. je kunt daar dus nog veel verder in gaan.

[nerd111]

Bedankt voor jullie reacties.

Vb: http://www.in-zicht.in

[Derk]

Als ik jou was zou ik dit in je menu doen:

Code: Selecteer alles

<?php if ($_SERVER['PHP_SELF']=='/jepagina.php') { ?>
Hier de code voor de kleur als hij geselecteerd is
<?php } else { ?>
en dan doe je hier de code voor de kleur als hij niet geselecteerd is.
<?php }  ?>

Als je '/jepagina.php' veranderd in de naam van de pagina van je menu link. En je veranderd mijn teksten, zou het goed moeten komen denk ik.

Als je niet weet wat je als paginanaam moet invullen kan je dit gebruiken om het weer te geven:

Code: Selecteer alles

<?php echo $_SERVER['PHP_SELF']; ?>

succes!

[nerd111]

Hmm... bedankt voor je reactie maar het wil niet lukken ...

Ik heb mijn menu nml. geïnclude... nou heb ik het eruit gehaald en toen zonder include in mijn pagina gezet, maar dat wil ook niet lukken.

De kleur die ik opgeef als de link niet geactiveerd is, komt trouwens bovenin te staan in de browser....

Iemand?

Mvg,

nerd111

[Derk]

Het maakt niet uit of je menu geinclude is of niet. Dit werkt in beide gevallen.

Code: Selecteer alles

<div><li><a href="index.php" title="home">home</a></li></div>
      <li><a href="overin-zicht.php" title="over IN-ZICHT">over IN-ZICHT</a></li>
      <li><a href="aanboddiensten.php" title="aanbod diensten">aanbod diensten</a></li>
      <li><a href="klantcases.php" title="klant cases">klant cases</a></li>
      <li><a href="agenda.php" title="agenda">agenda</a></li>
      <li class="last"><a href="contact.php" title="contact">contact</a></li>
    </ul>
  </div>

dat is je menu geloof ik he?
ervanuitgaande dat CSS en HTML geen probleem zijn kan je het als volgt oplossen:

Code: Selecteer alles

<div><li<?php if ($_SERVER['PHP_SELF']=='/index.php') { ?>
 class="grijs"
<?php } else { ?>
class="geel"
<?php }  ?>><a href="index.php" title="home">home</a></li></div>
      <li<?php if ($_SERVER['PHP_SELF']=='/overin-zicht.php') { ?>
 class="grijs"
<?php } else { ?>
class="geel"
<?php }  ?>><a href="overin-zicht.php" title="over IN-ZICHT">over IN-ZICHT</a></li>
      <li><a href="aanboddiensten.php" title="aanbod diensten">aanbod diensten</a></li>
      <li><a href="klantcases.php" title="klant cases">klant cases</a></li>
      <li><a href="agenda.php" title="agenda">agenda</a></li>
      <li class="last"><a href="contact.php" title="contact">contact</a></li>
    </ul>
  </div>

enz...

[nerd111]

Bedankt voor je reactie, maar het werkt niet. Ik weet niet meer wat ik fout doe...

[libia]

Bedankt voor je reactie, maar het werkt niet. Ik weet niet meer wat ik fout doe...

kun je dan misschien laten zien wat je doet (online voorbeeld en/of een stuk relevante code), dan kunnen wij wel kijken wat je fout doet

[nerd111]

Dit is mijn menu code die ik geinclude heb:

Code: Selecteer alles

<link href="global.css" rel="stylesheet" type="text/css" />
</head>
<body">
<div id="Container">
  <div id="Top">
   <p><font face="Trebuchet MS", Arial, Verdana" size="5">IN-ZICHT </font><i>training, coaching &amp; advies</i></p>
  </div>
  <div id="nav">
    <ul>
      <div><li<?php if ($_SERVER['PHP_SELF']=='/index.php') { ?>
[i]class="nav ul li"[/i]
<?php } else { ?>
[i]class="nav ul li a:hover"[/i]
<?php }  ?>><a href="index.php" title="home">home</a></li></div>
      <li><a href="overin-zicht.php" title="over IN-ZICHT">over IN-ZICHT</a></li>
      <li><a href="aanboddiensten.php" title="aanbod diensten">aanbod diensten</a></li>
      <li><a href="quotescoaching.php" title="klant cases">klant cases</a></li>
      <li><a href="agenda.php" title="agenda">agenda</a></li>
      <li class="last"><a href="contact.php" title="contact">contact</a></li>
    </ul>
  </div>

Ik denk dat het schuingedrukte de fouten zijn, maar wat moet ik daar invullen, want als ik het verkeerd doe dan wordt de menuknop opeens alleen tekst (dus zonder vakje) en werkt het nog steeds niet.

Ik wacht uw reactie af.

MVG!

[libia]

oke.. zo moet je het doen:

Code: Selecteer alles

<link href="global.css" rel="stylesheet" type="text/css" />
</head>
<body">
<div id="Container">
  <div id="Top">
   <p><font face="Trebuchet MS", Arial, Verdana" size="5">IN-ZICHT </font><i>training, coaching &amp; advies</i></p>
  </div>
  <div id="nav">
    <ul>
      <li class="<?php if($_SERVER['PHP_SELF'] == '/index.php'){ echo 'active'} else{ echo 'inactive'}?>"><a href="index.php" title="home">home</a></li>
      <li><a href="overin-zicht.php" title="over IN-ZICHT">over IN-ZICHT</a></li>
      <li><a href="aanboddiensten.php" title="aanbod diensten">aanbod diensten</a></li>
      <li><a href="quotescoaching.php" title="klant cases">klant cases</a></li>
      <li><a href="agenda.php" title="agenda">agenda</a></li>
      <li class="last"><a href="contact.php" title="contact">contact</a></li>
    </ul>
  </div>

dan maak je in je css
[code]#nav ul li.active { background: green; }
#nav ul li.inactive { background: red; }[/code

en die eerste code moet je dan natuurlijk zo aanpassen dat het bij alle item's is!

[nerd111]

nou, ik heb het geprobeerd, maar hij geeft een syntax error:-(

zit er een foutje in?

mvg en bedankt voor al het helpen.

[libia]

nou, ik heb het geprobeerd, maar hij geeft een syntax error:-(

zit er een foutje in?

mvg en bedankt voor al het helpen.

een syntaxerror betekend een fout ja

nou.. ik pak ff m'n glazen bol erbij, dan kan ik zo ff de error zien en dan help ik je verder!

tip: ff de error geven anders kunnen we niets voor je doen

[nerd111]

Dit is mijn geinclude 'menu.php':

Code: Selecteer alles

<link href="global.css" rel="stylesheet" type="text/css" />
</head>
<body">
<div id="Container">
  <div id="Top">
   <p><font face="Trebuchet MS", Arial, Verdana" size="5">IN-ZICHT </font><i>training, coaching &amp; advies</i></p>
  </div>
  <div id="nav">
    <ul>
      <li class="<?php if($_SERVER['PHP_SELF'] == '/index.php'){ echo 'active'} else{ echo 'inactive'}?>"><a href="index.php" title="home">home</a></li>
      <li><a href="overin-zicht.php" title="over IN-ZICHT">over IN-ZICHT</a></li>
      <li><a href="aanboddiensten.php" title="aanbod diensten">aanbod diensten</a></li>
      <li><a href="quotescoaching.php" title="klant cases">klant cases</a></li>
      <li><a href="agenda.php" title="agenda">agenda</a></li>
      <li class="last"><a href="contact.php" title="contact">contact</a></li>
    </ul>
  </div>

Dit is de error:
Parse error: syntax error, unexpected '}', expecting ',' or ';' in /storage/mijndomein/users/080368/public/sites/www.in-zicht.in/include/menu.php on line 10

[Remi]

Dit moet:
<?php if($_SERVER['PHP_SELF'] == '/index.php'){ echo 'active'} else{ echo 'inactive'}?
Zo worden, elke commandolijn hoor je aftesluiten met een ;
Dus:
<?php if($_SERVER['PHP_SELF'] == '/index.php'){ echo 'active' ; } else{ echo 'inactive' ; }?

[nerd111]

Bedankt, maar het werkt nog steeds niet....

code geinclude menu.php:

Code: Selecteer alles

<link href="global.css" rel="stylesheet" type="text/css" />
</head>
<body id="Container">
  <div id="Top">
  <p><font face="Trebuchet MS", Arial, Verdana" size="5">IN-ZICHT </font><i>training, coaching &amp; advies</i></p>
  </div>
  <div id="nav">
    <ul>
      <li class="<?php if($_SERVER['PHP_SELF'] == '/index.php'){ echo 'active' ; } else{ echo 'inactive' ; }?>"><a href="index.php" title="home">home</a></li>
      <li><a href="overin-zicht.php" title="over IN-ZICHT">over IN-ZICHT</a></li>
      <li><a href="aanboddiensten.php" title="aanbod diensten">aanbod diensten</a></li>
      <li><a href="quotescoaching.php" title="klant cases">klant cases</a></li>
      <li><a href="agenda.php" title="agenda">agenda</a></li>
      <li class="last"><a href="contact.php" title="contact">contact</a></li>
    </ul>
  </div>

Code css #nav:

Code: Selecteer alles

#nav
{
   height: 25px;
   background-color: #EFEFEF;
   width: 800px;
   margin-top: 0px;
   
}

div#nav ul
{
   height: 25px;
   list-style: none;
   width: 800px;
   display: inline;
   margin-left: 0px;
   padding-left: 0px;
}

div#nav ul li
{
   list-style: none;
   display: block;
   width: 133px;
   float: left;
   text-align: center;
   line-height: 25px;
   font-size: 12px;
   font-weight: normal;
   border-right: 1px solid #FFFFFF;   
}
div#nav ul li a
{
   width: 100%;
   height: 25px;
   display: block;
   color: ivory;
   text-decoration: none;
   font-family: "Trebuchet MS";
   font-size: 14px;
   border-bottom-width: 3px;
   border-bottom-style: solid;
   border-bottom-color: indigo;
   background-color: tan;
}

div#nav ul li.last
{
   width: 129px;
}
div#nav ul li a:active
{
   color: ivory;
   background-color: rosybrown;
   border-bottom-width: 3px;
   border-bottom-style: solid;
   border-bottom-color: indigo;
   font-weight: bold;
}
div#nav ul li a:hover
{
   color: ivory;
   background-color: rosybrown;
   border-bottom-width: 3px;
   border-bottom-style: solid;
   border-bottom-color: indigo;
   font-weight: bold;
}
#nav ul li.active
{
   color: ivory;
   background-color: rosybrown;
   border-bottom-width: 3px;
   border-bottom-style: solid;
   border-bottom-color: indigo;
   font-weight: bold;
}
#nav ul li.inactive
{
   color: ivory;
   background-color: rosybrown;
   border-bottom-width: 3px;
   border-bottom-style: solid;
   border-bottom-color: indigo;
   font-weight: bold;
}

Ik krijg geen errors, zit er ergens een foutje?

[Remi]

ik had toevallig gelijk probleem vandaag,
maar:
#nav ul li.active
moet
#nav ul li .active
met een spatietje er tussen.

[nerd111]

Bedankt allemaal, maar het werkt nog steeds niet:-(

VB: http://www.in-zicht.in/index.php

MVG!

[libia]

het ligt aan je css! als ik er in firebug naar kijk, dan zie ik gewoon class="active" staan, maar er hoort geen stuk css bij

edit wat remi zegt over die spatie is niet juist, die li heeft namelijk de class active.. dus het moet wel #nav ul li.active zijn (je kunt eventueel dat li weglaten )

[Remi]

Mijn FireFox fokt het anders aardig als er geen spatie tussen staat....
Maar mijn FireFox fokt wel meer dingen.

[libia]

Mijn FireFox fokt het anders aardig als er geen spatie tussen staat....
Maar mijn FireFox fokt wel meer dingen.

oke

met die spatie geld het namelijk voor een element binnen de li met een class="active"