28120 sujets

CSS et mise en forme, CSS3

Menu et a:active

Bonjour,

J'ai fais un menu style des sileus présent dans la galerie, et j'aimerai que lorsque je clique sur lien, celui-ci reste actif.
J'ai donc essayé avec la propriété a:active mais bof, ça ne semble pas vraiment marcher. Et apparement tout ce qui est lien fonctionne differement avec images et rollover qu'avec du simple texte.

Voilà ce que j'ai à la base (sans a:active):

.cadremenu {
	float: left;
	padding: 0px;
	margin: 0px 0px 0px -15px;
	width: 190px;
	height: 255px;
	background: transparent url(menu.gif) top left no-repeat;
}

.cadremenu a:hover {
	background: transparent url(menu.gif) top left no-repeat;
}

#menu1 {
	top: 34px;
	margin-left: 70px;	
	height: 32px;
	width: 75px;
}

#menu1:hover {
	height: 32px;
	width: 89px;
	margin-left: 57px;
	background-position: -57px -359px;
}

#menu2 {
	top: 44px;
	margin-left: 62px;
	height: 32px;
	width: 121px;
}

#menu2:hover {
	height: 32px;
	width: 131px;
	margin-left: 52px;
	background-position: -52px -401px;
}


J'ai fais quelques recherches dans le forum et je n'ai rien trouvé qui pouvait m'aider (ou alors j'ai mal chercher).

En vous remerciant.
bob88 a écrit :

J'ai fais un menu style des sileus présent dans la galerie, et j'aimerai que lorsque je clique sur lien, celui-ci reste actif.

Ce n'est pas possible avec CSS.

Recommandation CSS2 du W3C a écrit :

La pseudo-classe :active, qui est appliquée quand l'utilisateur active un élément. Par exemple, entre le moment où l'utilisateur presse le bouton de la souris et le relâche.

http://www.yoyodesign.org/doc/w3c/css2/selector.html#x36
Modifié le 26 Jan 2005 - 21:14
Ok, je m'etais fait une fausse une idée du a:active.

Merci pour les renseignements et les liens, je vais éplucher tout ça.
Oui knarf merci, mais dans un premier temps je ne pensais pas entrer autant dans les détails comme vous l'avez fait dans cet échange qui en dit long Smiley langue
Je voulais (comme toi apparement) uniquement un petit confort visuel supplementaire qui ne generait en rien l'accessibilité Smiley murf

J'ai d'ailleur appliqué rapidement ce systeme sans javascript sur ma page en construction et cela me plais beaucoup ^^

ps: oui ma page actuellement en ligne n'est pas valide et ce à cause de l'hebergeur gratuit que j'utilise (laposte) et qui ajoute automatiquement du code invalide (Xiti) à la fin du mien qui à la base est valide.
Modifié par webphn (29 Sep 2005 - 00:23)
Salut

Sur mon site, j'ai fait cela simplement comme cela :
a écrit :

<div id="menu">
<li><a href="page1.html">Page 1</a></li>
<li id="encours">Page 2</li>
<li><a href="page3.html">Page 3</a></li>
<li><a href="page4.html">Page 4</a></li>
<li><a href="page5.html">Page 5</a></li>
</ul>
</div>


J'ai un identifiant pour la page en cours que je mets à la place du lien sur la page. Voici le résultat: http://mypage.bluewin.ch/reel/photos/moscou.html
Cette methode ne plaira pas aux puristes, mais elle a l'avantage par rapport à la methode proposée par webphn que le bouton correspondant à la page en cours n'est plus un lien et qu'il n'est pas nécessaire de définir un identifiant pour chaque page.

Je ne suis qu'un petit débutant et n'ai donc qu'un solution incomplète. Je suis ouvert à toutes suggestion plus "pure".
Modifié par Reel (28 Sep 2005 - 20:03)
Sujet clos
Aller à