Comment marquer le lien vers la page en cours ? [Résolu]

Suite au dernier message de Laurie-Anne, message initial rectifié (et rédigé de façon peut-être plus explicite)

Bonjour

Pourriez-vous me communiquer une technique me permettant de marquer un lien <a href> de façon à indiquer que le lien correspond à la page en cours, sans que le marquage disparaisse lorsqu'on clique n'importe où dans la fenêtre du navigateur ?

Je m'explique :

J'ai une page html de menu dans laquelle chaque item appelle une page html.

Dans la css, j'ai défini (dans cet ordre) les propriétés a, a:focus, a.Item:hover, a.Item:focus, a.Item:active

a{
	list-style-type:none ;
	text-decoration:none ;
	cursor: pointer ;
	border:0 ;
	outline:none ;
	outline-style:0 ;
	}

a:focus {outline:none ; outline-width:0;}

a.Item:hover {
	color: #FF0; /* Couleur de survol du texte des items */ 
	}
	
a.Item:focus {
	color: #f94b1c; /*Couleur de l'item sélectionné */
	}
	
a.Item:active {
	color:#f94b1c;
	}

Lorsque je clique n'importe où dans la fenêtre du navigateur, le focus s'éteint et l'item sélectionné revient à l'affichage normal.

Comment puis-je faire pour que l'item sélectionné conserve son aspect (pour permettre de toujours savoir quelle est la page html en cours) lorsque le visiteur clique n'importe où dans la fenêtre ?

Merci d'avance pour votre réponse
Modifié par cadbor (15 Jul 2009 - 09:49)

Salut,

Perso je n'ai vraiment compris que la partie suivante, donc c'est uniquement à cela que je vais te répondre :

a écrit :
Comment puis-je faire pour que l'item sélectionné conserve son aspect (pour permettre de toujours savoir quelle est la page html affichée)

Il te suffit, dans chaque fichier html, de donner une classe particulière (ou un id) au lien correspondant à ce fichier, class="cettePage", par exemple. S'il n'y a pas de changement de page (si tes liens sont de simples ancres nommées, par exemple), il te faudra faire appel à Javascript.

Bonjour et bienvenue parmi nous

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle.



D'ailleurs, je rappelle que le lien "Aide" qui apparaît tout en haut du forum est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Concernant ton problème, une petite recherche dans la section "Apprendre" du site t'aurais permis de trouver cette astuce, qui répond tout à fait à ta question.

Bonsoir

Pardon pour cette omission : je ne savais pas encore utiliser le forum.

Je ferai attention la prochaine fois.

En tout cas, merci pour l'indication qui m'a permis d'obtenir ce que je désirais.

marcv a écrit :
Salut,

Perso je n'ai vraiment compris que la partie suivante, donc c'est uniquement à cela que je vais te répondre : Comment puis-je faire pour que l'item sélectionné conserve son aspect (pour permettre de toujours savoir quelle est la page html affichée)

Il te suffit, dans chaque fichier html, de donner une classe particulière (ou un id) au lien correspondant à ce fichier, class="cettePage", par exemple. S'il n'y a pas de changement de page (si tes liens sont de simples ancres nommées, par exemple), il te faudra faire appel à Javascript.


Merci de ta réponse... que j'ai réellement comprise après le message de Laurie-Anne et de la lecture attentive de la page qu'elle m'avait indiquée. Effectivement, ça marche bien ! (C'est un peu fastidieux lorsqu'il y a plusieurs pages de menu, mais une fois que c'est fait...)

cadbor a écrit :
Je ferai attention la prochaine fois.

Merci de ne pas attendre la prochaine fois pour corriger ton erreur.