Discussion :

[pierrot10]

Bonjour,

J'ai un petit problème pour que la class="active" s'applique sur les bons liens.

Voici plus de précision:
Voici mon menu (la partie concernée)

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
<div id="menu">
<ul>
<li class="menu level-1 active">
   <a href="/modx/index.php?id=3" title="Produits Anifit" >Produits</a>
   <ul class="sub-menu">
      <li class="menu level-2 active">
          <a href="/modx/index.php?id=4" title="Chats" >Chats</a>
      </li>
      <li class="menu last level-2"><a href="/modx/index.php?id=5" title="Chiens" >Chiens</a>
      </li>
   </ul>
</li>
</ul>
</div>

et voici mon code css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
#menu .menu.active a{color:#231f20;}

Dans ce cas, "produit", "chats", "chiens" sont en noir alors que j'ai cliqué sur chat et donc, "produits", "chats" devrait uniquement etre en noir

Comment faire pour que "chiens" ne soit pas impliqué?

J'aurais la même question pour 3 niveau.
Dans le cas du troiseme niveau, level-2 deviendra level-3

Merci a tous

[tzilliox]

Salut pierrot10 !

Le plus simple est de mettre la classe "active" sur ton lien et non sur ta balise "li". Est-ce possible dans ton cas ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<a href="/modx/index.php?id=3" title="Produits Anifit" class="active">Produits</a>
 
#menu .menu a.active{color:#231f20;}

Sinon, il suffit de surcharger les autres liens :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
#menu .menu.level-1.active a,
#menu .menu.level-1 .menu.level-2.active a,{color:#231f20;}
#menu .menu.level-1 .menu.level-2 a{color:#231f20;}

J'espère que ça t'aidera,
Thomas.

[pierrot10]

Ben oui, mais le probleme c'est que fait ce site avec un CMS et je ne peux pas mettre la classe dans le lien.

Je vais essayé ta proposition