Faire apparaître/disparaître du texte pour comparer

Salut,
Pour comparer la plus valu entre deux forfait, j'aimerais faire apparaître de manière permante les li.a-avance quand on clique sur a.a-avance. Il faut aussi que la classe disparaisse quand on reclique sur a.a-basic.Je ne pense pas que ce soit possible avec CSS mais je tente quand même comme je ne suis pas expert en la matière.

Je cherche une piste, pas la réponse complète s'il vous plait.

<aside id="controle">
<h3><a<img src="img/point-de-controle.png" alt="Point de contrôle" /></h3>
		<h4><a href="#" class="a-basic" >Pour le forfait basic:</a></h4> <h4><a href="#" class="a-avance">Pour le forfait avancé:</a></h4> <h4><a href="#" class="a-premium" >Pour le forfait premium:</a></h4>
		<h5>Véhicule au Sol</h5>
			<ul>
						<li><strong>L'éclairage:</strong>
								<ul>
										<li>Avant : veilleuse, croisement, route, antibrouillard, clignotants.</li>
										<li>Arrière : feux de position, stop, clignotants, recul, antibrouillard, feux de plaque, 3ème feu stop, voyant tableau de bord.</li>
								</ul>
						</li>
						<li>Niveau d’huile à la prise en charge</li>
						
						<li class="a-avance"><strong>Climatisation:</strong>
								<ul><li>Température soufflage</li>, <li>pression H.P</li> <li>pression B.P</li> <li>filtre d’habitacle</li></ul></li>

			</ul>
</aside>

Si ça fonctionne, je vois déjà mon petit effet de transition qui va bien. http://forum.culturepsg.com/style_emoticons/default/kratos77.gif

Merci d'avance.

Salut,

À moins d'utiliser la pseudo-classe :target en CSS 3 (auquel cas, la partie à masquer / afficher devra être contenue dans un élément comportant un attribut id dont la valeur servira d'ancre ciblée par le lien déclenchant l'effet souhaité), la solution passe par JavaScript pour ledit déclenchement.

Salut Victor,
La pseudo-classe target ne marche pas dans ce cas là puisque j'ai plusieurs li à faire apparaître. Et puis du point de vue ergonomique, c'est pas vraiment efficace comme la page descend sur l'ID, l'oeil rate l'effet d'apparition.

Je ne connais pas du tout JS. Tu ne connaîtrais pas un petit script qui traine sur la toile pour ce genre d'effet s'il te plait? J'avoue ne pas savoir ce que je dois taper sur google .

Sinon, tant pis, j'appliquerais la méthode old school. http://forum.culturepsg.com/style_emoticons/default/aaaaze.gif

Merci en tout cas.

David-Dante a écrit :
Je ne connais pas du tout JS.

Le JavaScript, tout comme le HTML et les CSS, ça s'apprend.

David-Dante a écrit :
Tu ne connaîtrais pas un petit script qui traine sur la toile pour ce genre d'effet s'il te plait? J'avoue ne pas savoir ce que je dois taper sur google .

Si ton but est de copier-coller des bouts de scripts prêts à l'emploi sans chercher à en comprendre le fonctionnement, sache que ce n'est pas la meilleure façon de progresser.

Cela dit, tu peux utiliser une bibliothèque comme jQuery, qui comporte une documentation bien fournie et enrichie de tutoriels, comme celui-ci, qui répond à ta requête. Soit dit en passant, l'utilisation de jQuery (ou de n'importe quelle autre bibliothèque JavaScript) ne te dispense pas de connaître les bases de JavaScript.
Modifié par Victor BRITO (12 Oct 2011 - 10:09)

Bonjour David-Dante,

Peux-tu m'expliquer pourquoi ajouter des photos en fin de tes messages ?

Laurie-Anne a écrit :
Bonjour David-Dante,
Peux-tu m'expliquer pourquoi ajouter des photos en fin de tes messages ?

Emoticon d'un forum extérieur...

@Victor: Apprendre le JS, c'est dans ma feuille de route (du moins, les bases pour ne pas bloquer sur ce genre d'effet) mais pas pour tout de suite.

Merci à toi, l'effet Toggle n'est pas très poli mais c'est ce que je cherchais.
Reste plus qu'à aller un peu plus loin que le tuto mais la base est là. J'espère pouvoir styler avec une transition css3.


@Laurie-Anne: Salut,
oui, ce sont des émoticons du forum hardware à la base mais qui sont repris sur un autre forum où je vais. Ils sont plus expressif et plus fun que des smileys je trouve (le Eboué, je m'en lasse pas ).
Le laporte est culte aussi: http://forum.culturepsg.com/style_emoticons/default/implosion%20du%20tibia.gif
Bref...