Déroulement progressif

[Ayael]

Bonjour, j'ai un code ouvrir/fermé, mais j'aimerai qu'il s'ouvre/se ferme avec un mouvement de déroulement progressif... Comme je n'arrive à rien, je m'en remet a vous!

(Je précise que je souhaite un déclenchement au click ce qui rend l'utilisation des transitions css impossible...)

Code:

        <div class="masque" onClick="this.firstChild.src=(this.firstChild.src=='http://img4.hostingpics.net/pics/173208profil.png')?'http://i35.servimg.com/u/f35/15/85/21/51/sans_t11.jpg':'http://img4.hostingpics.net/pics/173208profil.png';this.lastChild.style.display=(this.firstChild.src=='http://img4.hostingpics.net/pics/173208profil.png')?'none':'block';" style="text-align: center; padding: 3px;">
  <input type="image"
src="http://img4.hostingpics.net/pics/173208profil.png"/>
  <div style="display: none; text-align: left;">
  <span style="white-space:nowrap;">
Contenu </span></div></div>
     



Merci d'avance pour votre aide!

[Adam_sfp]

Bonjour

Regardez peut être Jquery slidetoggle

Cordialement.

[Ayael]

C'est gentil, mais le tutoriel est en anglais, donc si vous pouviez juste me guider un peu plus... (D'autant plus que je ne sais pas comment l'insérer dans mon code ^^")

[Adam_sfp]

Bonjour

Il faut faire un nouveau code ..
Ou voulez vous mettre cet effet sur votre forum?

Cordialement.

[Ayael]

Je veux m'en servir pour ma barre de navigation, donc le faire sur toute les pages.

[Adam_sfp]

Je veux m'en servir pour ma barre de navigation, donc le faire sur toute les pages.

bonjour

pour la barre de navigation ?
je ne comprend pas trop votre demande..
peut être un screen?

Cordialement.

[Ayael]

Heu... c'est un peu compliqué à expliquer ...
http://version5.lebonforum.com/
En gros, je veux faire ça, (cliquez sur profil) mais avec un effet de déroulement progressif.

[Ayael]

Un courageux^^?

[Adam_sfp]

Bonjour

Vous pouvez essayez de mettre pour la partie HTMl

Code:

 <a href="#" class="show_hide"><img src="http://img4.hostingpics.net/pics/173208profil.png" /></a>
<div class="slidingDiv">

CONTENU

</div>

et dans la gestion des codes javascript

Code:

$(document).ready(function() {

    $(".slidingDiv").hide();
 

    $('.show_hide').click(function() {
        $(".slidingDiv").slideToggle(5000);
    });

});

Cordialement.

[Ayael]

Ca marche parfaitement, merci !