Version complète: sur le forum Webmaster Hub : Onglets en css
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
mathieu147
Bonjour,

Je voudrais faire des onglets en css. Il y a plein de tutoriels sur le net à propos de ça, mais ils expliquent plein de choses inutiles (ils font 3 pages pour me dire comment mette une couleur diférente à l'onglet actif), sans penser à l'essentiel.

Il y a en effet une question que je me pose depuis que je veux faire des onglets, et à laquelle aucun tutoriel n'a apporté de réponse : "Comment définit-on l'onglet actif?".

Dans les tutos que j'ai lu, on faisait une liste, puis on mettait un id à la balise <li>, qui devenait <li id="actif"> par exemple.

MAIS!

C'est plutôt statique comme solution! Parce que si j'ai le 1er onglet actif, j'ai ceci:
CODE
<ul>
<li id="actif">lien 1</li>
<li><a href="lien2.html">lien 3</a></li>
<li><a href="lien3.html">lien 2</a></li>
</ul>

Mais, si je clique sur le 2ème, il faudra, dans ma page "lien2.html", que j'aie ça:
CODE
<ul>
<li><a href="lien1.html">lien 1</a></li>
<li id="actif">lien 3</li>
<li><a href="lien3.html">lien 2</a></li>
</ul>


Donc il faudrait que je réécrive le menu pour chaque page! Donc le coup du include(menu.php) c'est foutu!

Ou alors faut modifier menu.php pour qu'il prenne en compte un argument pour savoir quel onglet activer? Ca me paraît compliqué...

N'y a-t-il pas une solution simple?


Merci :-D
Athmos
Un menu en CSS sans préchargement, mais tu perds l'aspect "actif"... wacko.gif
Portekoi
Lu,

Dans ta page au dessus de ton include (menu.php) tu rajoutes page="sorcier_glouton" et donc dans ton code :



Et ensuite :

<ul>
<li id="<?if ($page=="sorcier_glouton"){echo "actif";}else{echo "inactif";}?>">lien 1</li>
<li id="<?if ($page=="sorcier_glouton2"){echo "actif";}else{echo "inactif";}?>"><a href="lien2.html">lien 3</a></li>
etc... smile.gif
</ul>

++

Portekoi
mathieu147
Comme quoi, c'est pas forcément compliqué! biggrin.gif

Merci Portekoi! Je vais tenter ça tout de suite. Si vous ne me revoyez pas, c'est que ça a fonctionné ;-)
Régis
CITATION(portekoi @ lundi 07 mars 2005, 15h32)
Dans ta page au dessus de ton include (menu.php) tu rajoutes page="sorcier_glouton" et donc dans ton code :
Et ensuite :
<ul>
<li id="<?if ($page=="sorcier_glouton"){echo "actif";}else{echo "inactif";}?>">lien 1</li>
<li id="<?if ($page=="sorcier_glouton2"){echo "actif";}else{echo "inactif";}?>"><a href="lien2.html">lien 3</a></li>
etc... smile.gif
</ul>

Bonjour,

"portekoi" préconise de rajouter " page="sorcier_glouton" " (par exemple)...
mais je ne comprends pas où le mettre...
Quelqu'un peut-il éclairer le néophyte PHP que je suis...

Merci
Portekoi
Salut,

Rajoutes le avant ton menu smile.gif

A toute

Portekoi
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.