Cr�er son site Gratuitement : Service / Outils webmaster gratuit
Mon Site Gratuit
Contactez nous
Nos partenaires
Scripts
Tutoriaux
Nos services
Forums
Accueil
Afficher / masquer un texteAfficher / masquer un texte
 
Afficher / masquer un texte

Javascript | Afficher / masquer un texte

Script crée par Black le 06-05-2008.

SocialTwist Tell-a-Friend

Ce script permet d'afficher ou de masquer un texte en cliquant sur un lien! Très efficace pour les menus!

Bonjour à tous, voilà un petit script sympa qui permet d'afficher ou de masquer un texte :bravo:

Afficher / Masquer un texte en Javascript


Code Javascript


==> A placer entre <head> et </head>


Code :
<script>
function visibilite(thingId)
{
var targetElement;
targetElement = document.getElementById(thingId) ;
if (targetElement.style.display == "none")
{
targetElement.style.display = "" ;
} else {
targetElement.style.display = "none" ;
}
}
</script>



Code (x)HTML


==> A placer entre <body> et </body>


Code :
<a href="javascript:visibilite('divid');">afficher/masquer</a>
<div id="divid" style="display:none;">
<!-- Ici, le texte que l'on veut afficher -->
</div>



Code CSS


C'est loin d'être obligatoire, mais ça fait plus jolie ;-)


Code :

div#divid
{
border: 1px dashed black; /* Un contour pour délimiter et faire plus joli */
padding: 5px; /* Un petit espace pour pas que le texte colle le cadre */
}



Bien sur, vous pouvez modifier la couleur, ou le style de la bordure ;-)



ScreenShots


Histoire de bien vous montrer ce que ça donne ;-D

http://i41.servimg.com/u/f41/11/91/02/60/aff10.png

http://i41.servimg.com/u/f41/11/91/02/60/aff210.png

Black


Poster un commentaire

Commentaire :

*Vous devez être connecté pour pouvoir poster un commentaire
Si vous n'êtes toujours pas inscrit, cliquez ici !

Commentaires

Salut, alors moi j' utilise wordpress, et ce script marche très bien dans les articles, mais pour ceux qui connaisse wordpress, quand on arrive sur la page index, il y a tous les nouveaux articles et c'est à partir de là qu' il y a un problème. Il n' y a que le premier article de la liste qui fon ...

gwenm

merci beaucoup, ça marche nickel, a un petit detail pres :)

quand je clique sur le lien 2 il cache bien mon texte 1 et affiche le Texte 2 (pile poil ce que je voulais) mais quand je clic de nouveau sur le lien 2 il cache le texte 2 pour afficher le texte 1 alors qu'il faudrait juste ...

mandrake

Salut!
Je te propose ceci:
[code:f0rpsb8o]<html>

<head>

<title>DHTML Test</title>

<script>
function visibilite(thingId)
{
if (divid.style.display == "none")
{
divid ...

boulledogue

Bonjours, j'ai une petite question:

Quand je clic sur mon lien 1, le texte 1 s'affiche (jusque la ça va ) mais je souhaiterai que le texte 1 ce cache pour afficher le texte 2 quand je clic sur le lien 2 et inversement (quand je clic sur le lien 1 le texte 2 ce cache et le texte 1 s'a ...

mandrake

Ouah ! Pile poil ce qu'il me faut ! Merçi beaucoup !

BlackSheep

merci

ibnyassin

mercie

ibnyassin

Soumettre un script Javascript

*Vous devez être connecté pour pouvoir soumettre un script
Si vous n'êtes toujours pas inscrit, cliquez ici !