Bonsoir à tous !

Je cherche a créer un système on on pourrait afficher et masquer un texte lorsque que l'on clique sur un lien ( un peu comme si on développait un noeud )

exemple :

+ afficher mon texte 1
+ afficher mon texte 2
+ afficher mon texte 3

si je clique sur le + de afficher mon texte 1, alors ça me donne :

- afficher mon texte 1
Voici mon texte, blblab, ça peut aussi être une image un tableau etc ... Voici mon texte, blblab, ça peut aussi être une image un tableau etc ... Voici mon texte, blblab, ça peut aussi être une image un tableau...
+ afficher mon texte 2
+ afficher mon texte 3

Je compte mettre en place un tel système sans une seule goutte de javascript, donc je voulais savoir si il était possible de le faire en HTML + CSS uniquement et si oui, comment ?

Merci à vous !

http://reference.sitepoinint.com/css/pseudoclass-target

-> http://wall.deblan.fr/x211b/html/1/

Je veux m'en passer à cause des problèmes d'incompatibilité ( principalement avec IE ) car je compte développer un site professionnel et je ne souhaite pas qu'un individu lambda qui lance mon site web sur IE n'arrive pas à accéder au contenu d'une FAQ ( par exemple ) à cause d'une incompatibilité de javascript.
Par exemple, les scripts JS pour les menus dépliants que je trouve sur le web m'affichent tous une erreur sur Internet Explorer ( " le javascript a été désactivé pour votre sécurité blablabla " et dans l'éventualité ou ça serait un novice du web qui visiterait mon site, je n'aimerais pas perdre ce client potentiel car celui-ci n'arrive pas à consulter le site convenablement ) par contre j'ai remarqué qu'il y a un système "show/hide" fonctionnel sous tous les navigateurs sur le site de MSDN..

Si tu commence à essayer de rendre ton site 100% compatible IE t'as pas fini. Entre le js, le support du css douteux, la transparence du png non prise en charge...

Salut,

Cette petite astuce pourrait t'aider : http://www.pmob.co.uk/temp/hideandshow3-css.htm

Mais bon je reste de l'avis qu'un peu de JS serait mieux. Tu pourrais dans ce cas penser à tester si JS est activé ou non et s'il est désactivé, faire la solution que je viens de te proposer.

Pour cela tu devras bidouiller avec la balise <noscript>...</noscrpit> pour "vérifier" JS.

Merci Onigawara, c'est très sympa de ta part de me faire partager ce lien, je trouve néanmoins que ça fait un peu " pré-mâché " comme mécanisme ( dessiner les blocs à l'avance, prévoir la quantité de texte qu'il y aura à l'intérieur etc, c'est très prise de tête même si c'est un concept intéressant )

Par conséquent, je pense que je vais devoir me résoudre à employer du JS.. car plus fiable, plus simple, plus rapide ( mais l'incompatibilité m'emm*rde ! )

utilises une bibliothèque telle que jquery ou mootools qui prennent en charge les différents navigateurs.

Re,

J'ai donc adapté un système javascript sur ma FAQ, ça marche plutôt bien mais j'ai un autre soucis.

Lorsque je clique sur une question de la faq ( sous forme de lien href ), la réponse s'affiche bel et bien mais... en dessous de tous les liens des autres questions et non en dessous de la question concernée, comment y remédier ? Merci

Salut ! Désolé de la réponse tardive, mais en surfant sur le Site du Zéro j'ai trouvé un moyen de justement afficher/masquer du texte sans aucun code JavaScript !

Par contre c'est en utilisant du HTML5 et CSS3, donc question compatibilité avec les anciens navigateurs...

Après à toi de voir.

http://www.siteduzero.com/tutoriel-3-548978-ciblons-nos-elements.html#ss_part_4

C'est tout en bas, sur la partie du sélecteur :target, le deuxième exemple !

Et sur un exemple appliqué, voici ce que tu peux faire :

http://mariouniversalis.no-ip.org/tutoSdZ/css3/selectors/exemple13.html

C'est ce que j'ai proposé vava740

messy94 sans code et sans rendu, on ne peut pas t'aider