[HTML/CSS] Spoiler

Marsh Posté le 08-12-2007 à 17:56:20

Bonjour,

voilà, je suis en train de réaliser un petit site internet en html et css.
j'aurais besoin de trouver un moyen de faire comme un spoiler. En fait c'est un site avec des exercices et j'aimerais qu'il y ai comme une aide,
mais facultative, donc que si la personne en a besoin elle "active" l'aide ce qui afficherait le texte d'aide.
Y a t-il un moyen de faire ca en html ou pas?

merci

Message édité par the nordcore le 08-12-2007 à 18:28:09

Reply

Marsh Posté le 08-12-2007 à 17:56:20

Reply

Marsh Posté le 08-12-2007 à 21:51:26

La propriété visibility est peut-être utile dans ce cas.
Au début, dans onLoad, il y aurait :

document.getElementById('spoiler1').style.visibility='hidden';

puis dans onClick, il y aurait

document.getElementById('spoiler1').style.visibility='visible';

Reply

Marsh Posté le 09-12-2007 à 13:03:53

ok merci, je vais essayé avec visibility, je ne connaissais pas cette propriété en css

---------------
0x53 0x61 0x6C 0x65 0x47 0x65 0x65 0x6B

Reply

Marsh Posté le 09-12-2007 à 13:21:41

une recherche aurait pu etre utile
http://forum.hardware.fr/forum2.ph [...] w=0&nojs=0

---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell

Reply

Marsh Posté le 10-12-2007 à 09:39:31

j'avais reussi, merci

je poste le code ce soir pour ceux que ca interresse

---------------
0x53 0x61 0x6C 0x65 0x47 0x65 0x65 0x6B

Reply

Marsh Posté le 10-12-2007 à 16:51:01

voivi une fonction en javascript

Code :

function montrer_spoiler(value) {
var actual=document.getElementById(value).style.visibility;
if (actual=='visible') {
document.getElementById(value).style.visibility='hidden';
} else {
document.getElementById(value).style.visibility='visible';
}
}

et dans ma pahe xhtml

Code :

<div class="container">
<table class="spoiler" onclick="javascript:montrer_spoiler('spoilers')" style="cursor: pointer;">
<tbody>
<tr class="none">
<td>
<p>Hint : (click to display)</p>
<div class="Topic masque" id="spoilers" style="visibility:hidden">
<p>/*ce que vous voulez cacher*/</p>
</div>
</td>
</tr>
</table>
</div>

---------------
0x53 0x61 0x6C 0x65 0x47 0x65 0x65 0x6B

Reply

[HTML/CSS] Spoiler

Sujets relatifs:

Leave a Replay