Faire apparaitre et disparaitre des éléments dans une page

pompon_56 Messages postés 4 Date d'inscription vendredi 18 novembre 2005 Statut Membre Dernière intervention 9 janvier 2008 - 18 nov. 2005 à 22:30
cs_JoBleu Messages postés 91 Date d'inscription dimanche 18 août 2002 Statut Membre Dernière intervention 21 février 2015 - 10 mars 2006 à 09:44
Salut salut,
Comme indiqué dans le titre je cherche un script afin de permettre l'affichage ou la disparition d'éléments sur une page. A vrai dire, ce que je cherche c'est exactement ce que ce site (remarquable) utilise pour décrire les sources. Par exemple : http://www.javascriptfr.com/code.aspx?ID=27705' target='_blank'>http://www.javascriptfr.com/code.aspx?ID=27705 il suffit de cliquer sur le petit carré avec le - pour réduire le bloc ou au contraire cliquer sur le carré avec le + pour le faire apparaitre.
Est-il possible de récupérer ce code?
merci d'avance,
Julien

4 réponses

Anthed Messages postés 152 Date d'inscription dimanche 20 février 2005 Statut Membre Dernière intervention 17 janvier 2014 3
19 nov. 2005 à 00:43
Hello.
Tu peux mettre toute la partie que tu souhaites masquer/afficher dans un div avec un id="test". Sur le bouton, il n'y a plus qu'à appeler une fonction qui change ton bouton (de + à - et l'inverse) et qui fait : document.getElementById("test").display = "none" ou "" pour respectivement masquer et afficher ton div.
A+.
pompon_56 Messages postés 4 Date d'inscription vendredi 18 novembre 2005 Statut Membre Dernière intervention 9 janvier 2008
21 nov. 2005 à 16:46
Salut,
Merci pour ta réponse.
Voilà où j'en suis !
Chaque bloque de texte que je veux afficher ou masquer est généré en php à partir d'une bdd.
C'est pourquoi les id sont des variables.
la fonction ci-dessous fonctionne presque.
j'ai bien l'impression que la variable img (ci-desous en rouge) n'est pas inséré correctement. Seulement, je ne débute en javascript, je ne connais pas très bien la syntaxe.
merci d'avance pour un petit coup de pouce.
Julien

<script language="javascript">
function hideShow(id_div)
{
var img = "image";
img += id_div ;
if (document.getElementById(id_div).style.display=='block')
{
document.getElementById(id_div).style.display='none'
document.img.src='../img/arrow_down.gif'
}
else
{
document.getElementById(id_div).style.display='block'
document.img.src='../img/arrow_up.gif'
}
}
</script>

</head>

[# ]

test |
----
page 1,
----
page 2

<hr>
[# ]

test |
----
page 1,
----
page 2
Anthed Messages postés 152 Date d'inscription dimanche 20 février 2005 Statut Membre Dernière intervention 17 janvier 2014 3
21 nov. 2005 à 23:33
Hello !
Il suffit d'accéder à ton image comme tu accèdes à ton div, par son id :

<html>


<head>
<meta name= "GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
</head>


<script language="javascript">
function hideShow(id_div)
{
var img = "image";
img += id_div ;
if (document.getElementById(id_div).style.display=='block')
{
document.getElementById(id_div).style.display='none'
document.getElementById(img) .src ='../img/arrow_down.gif'
}
else
{
document.getElementById(id_div).style.display= 'block'
document.getElementById(img) .src ='../img/arrow_up.gif'
}
}
</script>




[#

]

test |
----
page 1,
----
page 2

<hr>
[#

]

test |
----
page 1,
----
page 2




</html>

Et voilà. Bonne continuation.
cs_JoBleu Messages postés 91 Date d'inscription dimanche 18 août 2002 Statut Membre Dernière intervention 21 février 2015
10 mars 2006 à 09:44
N'oubliez pas de tester votre page sur Internet Explorer ET sur Netscape (ou Mozilla).

JoBleu
Rejoignez-nous