Rechercher : dans
Par :

Balise [spoiler] en (x)HTML/CSS

Dernière réponse le 6 jui 2009 à 19:30:24 reynolds, le 16 aoû 2008 à 23:05:58 
 Signaler ce message aux modérateurs

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

Configuration: Windows XP/Ubuntu 8.04
Firefox 3.0.1

Meilleures réponses pour « Balise [spoiler] en (x)HTML/CSS » dans :
Enlever le soulignement sous les liens en HTML/CSS Voir Par défaut, les liens hypertextes en HTML sont soulignés, un trait de la couleur du lien apparaît en dessous du texte. Il est possible de supprimer ce soulignement à l'aide de la propriété CSS text-decoration:none : Grâce au CSS Grâce au CSS via...
Enlever la bordure sur une image dans un lien en HTML/CSS VoirVous avez fait une image cliquable en mettant une balise IMG au sein d'un lien et le navigateur vous affiche un cadre ou plus exactement une bordure autour de l'image. Il existe deux façons de supprimer cette bordure...
Créer un site beau, dynamique et respectueux des standards VoirVoici une liste de liens qui vous aideront à mieux exploiter les standards (HTML, CSS, DOM...) pour créer des sites plus beaux, plus dynamiques et plus respectueux des standards. A la fin de cette page, il y a également une liste de...
Javascript - Centrer verticalement une page web VoirPour centrer verticalement une page web, impossible de s'en sortir en css. Une solution bien pratique : JavaScript. 1. Le fichier .js 2. La page .html 3. Utilisation 4. Inconvénients 5. Rappel Merci à Dalida pour la source du...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
La syntaxe des style (CSS) VoirDéfinition d'un style La définition d'un style se fait à l'aide de règles en texte simple permettant de décrire l'aspect des éléments de la page. Une règle CSS est caractérisée par deux principaux éléments : Un sélecteur de balises, permettant de...
DHTML - La notion de couche VoirQu'est-ce qu'une couche? Le DHTML est basé sur une fonctionnalité provenant de la norme 4.0 du HTML: les feuilles de style en cascade de positionnement, aussi appelée CSS-P (Cascading Style Sheets Positionning). Celles-ci permettent de définir des...

1

ThEBiShOp, le 16 aoû 2008 à 23:08:40
  • +1

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é

Répondre à ThEBiShOp

2

reynolds, le 17 aoû 2008 à 02:20:09

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

Répondre à reynolds

3

reynolds, le 17 aoû 2008 à 02:40:12
  • +1

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>

Répondre à reynolds

4

 Lothindil, le 6 jui 2009 à 19:30:24
  • +1

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

Répondre à Lothindil
Collection CommentÇaMarche.net