Bonjour,

J'aimerais pouvoir mettre en place un code sous forme de spoiler sans utiliser Javascript, puisque je ne peux pas le faire. Il faudrait que lorsque l'on clique sur l'image, ou le texte, un second élément apparaisse.

J'aurais bien utiliser les balises:

[spoiler][/spoiler]

Mais le problème avec celles-ci est que l'on ne peut pas les personnaliser (changer la couleur, police d'écriture, etc...)

Quelqu'un aurait-il une solution à me donner?

Merci d'avance!

Ce que tu peux faire c'est :

<div class="spoiler">
	Spoiler
	<div>
		Ton contenu
	</div>
</div>

A la base, le div ayant le contenu est en display: none;

Au moment de l'hover sur le div ayant la class, tu le mets en display: block;

Si tu veux faire ça avec un clique, tu peux utiliser :target. Ou alors, on dirait qu'il y a une autre méthode ici.

salut,

j'ai plusieurs exemples dont :

http://dabblet.com/gist/4694413

http://yidille.free.fr/discontinu/lightbox-css3.html

http://yidille.free.fr/plux/valign/?59-afficher-cacher-un-div-au-clique-en-css

et un ou tu affiche en triant tout, une partie ou rien :

http://dabblet.com/gist/4641739

En gros les possibilités sont multiples,

Il te faut bien définir ton scenario et ta structure HTML,

ensuite te faire globalement l'inventaire des styles utilisables,

et enfin au besoin revoir ton HTML ( si besoin vraiment ).

En dernier , j'ajouterais que la balise <details> peut être ta soluce

http://www.alsacreations.com/article/lire/1335-html5-details-summary.html

Signature :

##_________________________________________________________________//

  D'autre morceau de tests divers et variés sur : http://dabblet.com/user/gcyrillus

-
Edité par gcyrillus 16 février 2013 à 17:59:51