Faire apparaitre/disparaitre une div

31 mai 2007, 12:23

Salut,

j'ai ce code pour faire apparaitre/disparraitre une div :

<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='down.png'
        }
    else
        {
        document.getElementById(id_div).style.display='block'
        document.getElementById(img).src='up.png'
        }    
    }
</script>

<a href="#"><img src="down.png" name="image1" border="0" id="image1" onClick="hideShow(1)"></a>
<div id="1" style="display:none ">
contenu
</div>

Ce code marche bien et fait donc apparaitre/disparraitre "tout d'un coup", comment faire pour que ca fasse une ouverture et fermeture comme un "volet"?

Merci de votre aide

31 mai 2007, 13:24

Tu peux utiliser un framework Javascript pour faire de jolis effets sur l'ouverture / fermeture de div. Mootools par exemple (http://mootools.net/), en prenant les fonctions FX.

31 mai 2007, 18:46

Il n'y a pas un moyen de faire quelque chose avec mon script?

31 mai 2007, 18:50

Oups, je n'étais pas identifié, désolé.

02 juin 2007, 10:28

Personne?

02 juin 2007, 10:53

Pour faire ça, il faudrait que tu joues sur les propriétés CSS du bloc à faire apparaître/disparaitre avec un système de timeout JavaScript.

Il existe même des librairies genre script.aculo.us qui proposent des variantes, mais ça peut vite devenir lourd en terme de code

04 juin 2007, 18:13

J'ai essayé ce script : http://demos.mootools.net/Fx.Slide

Mais il ne fonctionne pas chez moi.

05 juin 2007, 01:51

J'ai essayé ce script : http://demos.mootools.net/Fx.Slide
Mais il ne fonctionne pas chez moi.

Quel est le problème? Tu as des erreurs?
Nous n'avons aucune idée de l'implantation que tu as fait de la librairie proposée sur ce site. On ne peut donc pas deviner malheureusement.

05 juin 2007, 08:18

J'ai essayé sur une page vierge de mettre exactement les codes proposés par le lien ci-dessus, et rien ne marche.

Faire apparaitre/disparaitre une div

Qui est en ligne