Menu avec onglet actif [Résolu]

[papayou94]

Bonsoir à tous,

J'aurais aimé savoir quel langage utiliser pour faire un menu dans ce style : http://www.cyrilgaillard.com/faites-connaissance.html c'est à dire avec une distinction lorsqu'on se trouve sur la page active.

Merci

[12monkeys]

Bonsoir

Tu vas avoir plusieurs fichiers html, chacun correspondant à une entrée de ton menu, donc le plus simple c'est pour chaque page de mettre un style CSS spécifique à l'entrée du menu de la page en question.

Basiquement cela donne ceci :

Code html :

1
2
3
4
5
6
7
8
9
10
11
12
13
<ul>
  <li class="lienclassique">
Lien 1
  </li>
  <li class="lienactif">
Lien 2
  </li>
  <li class="lienclassique">
Lien 3
  </li>
  <li class="lienclassique">
Lien 4
  </li>

Code css :

1
2
.lienclassique { background-color : blue; }
.lienactif { background-color : red; }

[papayou94]

Oui mais là ca implique d'avoir un menu différent pour chaque page du site,
Ce que je veux dire c'est qu'on peut surement faire la même chose mais depuis un menu unique que l'on include en php mais je sais pas trop avec quoi m'y prendre pour faire ca ?

[12monkeys]

Bon c'était pas précisé dans ta demande, donc je suis parti du plus simple...

Ce que tu veux faire tu peux y arriver avec PHP, soit en insérant une variable au début du fichier, soit en récupérant le nom de page via PHP. Ensuite tu vérifies quelle page s'affiche pour modifier le CSS :

Code php :

1
2
3
4
<ul>
  <li <?php if ($nompage == 'accueil') { echo 'class="lienclassique"'; } else { echo 'class="lienactif"'; } ?>>
Lien 1
  </li>

Ça doit aussi être faisable en javascript...

[papayou94]

J'ai fait avec des variables en début de fichier et roole

Merci