Balise [spoiler] en (x)HTML/CSS

Fermé
reynolds - 16 août 2008 à 23:05
 UnAnonyme - 1 nov. 2012 à 05:47
Bonsoir,

je recherche l'équivalent à une balise [spoiler] en xHTML ;-)

En fait je veux pouvoir réaliser le même effet qu'un spoiler en phpBB mais sur un site en xHTML/CSS le but étant de cacher/afficher un javascript (un petit script comme l'incrustation d'une carte google maps) ou une portion de texte ou autre... Je crois qu'il y a des propriété qui permettent ça mais je ne sais pas les quelles et comment les appliquer. Là j'ai pas bien le temps de chercher sur google donc si quelqu'un passe pas là avec la solution je lui en serais très reconnaissant :super:

Merci d'avance ;)

Reynolds
A voir également:

5 réponses

re;

j'ai testé un petit script mais je sais pas si c'est bien "propre" :

function show_hide(obj,bloc)

{

elt=document.getElementById(bloc);

if (elt.style.display == 'none')
{

elt.style.display='block';

}

else {

elt.style.display='none';

}

}

Puis dans le corps de ma page:


<div onclick="show_hide(this,'bloc_test');" id="corps">

Google Earth

</div>

<div id="bloc_test" style="display:none">

Le texte que je tape ici est caché d'office et apparait au clic sur "Google Earth"

</div>
2
Merci pour cette précieuse aide !
0
ThEBiShOp Messages postés 8378 Date d'inscription jeudi 22 mars 2007 Statut Contributeur Dernière intervention 8 février 2021 1 565
16 août 2008 à 23:08
mmmh en principe ça devrait être relativement simple.

le but étant de jouer sur la propriété css "display" de l'élément à cacher (si tu le mets dans une div ça devrait être plus simple)
et avec un lien par exemple, avec l'évènement "OnClick" tu changes la valeur de cette propriété
1
Bonsoir;

merci pour ta réponse ;)

Je ne connais pas trop cette propriété et ses valeurs ... :/

Pourrais tu me montrer un exemple ?

Merci d'avance
1
Excellent code, très simple à utiliser, très clair simple et peu coûteux en ressource. Merci ;)
1

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Salut,
La propriété CSS "display" peut avoir 4 valeurs (ou plus?) :

element { 

display:none; /*
L'element n'est ni afficher, ni chargé dans la page.
*/ 

display:block; /*
C'est l'état par défaut des <div> : Les elements sont affichés les uns en dessous des autres.
*/ 

display:inline; /*
C'est l'état par défaut des <span> : Les elements sont affichés les uns à coté des autres.
*/ 

display:inline-block; /*
Les elements sont affichés les uns à coté des autres, mais on peut désormais leurs appliquer des propriétés CSS réservées aux <div>.
*/ 
}
En espérant aider.
0