Ajouter .slidetoggle à un script

[Space Sapien]

Bonjour à tous,

j'ai créé un onglet à partir d'un tuto disponible sur le forum.

Code:

jQuery(document).ready(function () {
    jQuery('body').append('<table style="position: fixed; bottom: 50px; left: 0px;z-index:10000;"><tr><td><div id="panneleft" scrolling="no" style="width: 200px; height: 200px; display: none;" marginwidth="0" marginheight="0" frameborder="0">

BLABLABLA
                                                                                   
</div></td><td style="vertical-align: bottom;"><img src="http://nsa34.casimages.com/img/2015/03/11/150311023531222960.png" onclick="document.getElementById(\'panneleft\').style.display=(this.src==\'http://nsa34.casimages.com/img/2015/03/11/150311023531222960.png\')?\'block\':\'none\';this.src=(this.src==\'http://nsa34.casimages.com/img/2015/03/11/150311023531222960.png\')?\'http://nsa34.casimages.com/img/2015/03/11/150311023531714485.png\':\'http://nsa34.casimages.com/img/2015/03/11/150311023531222960.png\';"/></td></tr></table>');


});

Il fonctionne bien, mais j'aimerai ajouter un .slideToggle("slow") pour avoir une animation ouverture / fermeture plus sympa et je ne suis pas parvenu à le faire xD Quelqu'un saurait m'aider, s'il vous plait ?

[Space Sapien]

Up

[Space Sapien]

Up

[Space Sapien]

Up

[oxymore]

Bonjour

Utilisez le générateur qui possède un effet " slide"
http://aska.123.st/h10-generateur-de-pannel

[Invité]

Salut Space Sapien,

la fonction animate remplacera aisément le script actuel:

Supprimes la totalité par :

Code:


$(document).ready(function () {
$('body').append('<table style="position: fixed; bottom: 50px; left:0px;z-index:10000;"><tr><td>
<div id="panneleft" scrolling="no" style="margin-left:-200px;width: 200px; height: 200px;marginwidth="0" marginheight="0" frameborder="0">
       
        BLABLABLA
                                                                                         
        </div></td>
<td style="vertical-align: bottom;">
<img id="M14_open"src="http://i19.servimg.com/u/f19/11/26/21/37/open10.png"style="cursor:pointer;"/>
<img id="M14_close"src="http://i19.servimg.com/u/f19/11/26/21/37/close10.png"style="display:none;cursor:pointer;"/>
</td></tr></table>');

});
//Fonction pour l ouverture
$(function(){
$('img#M14_open').click(function(){
$(this).hide();
$('#panneleft').animate({marginLeft: '0px'}, "slow");
$('#M14_close').show();
});
});

//Fonction pour la fermeture
$(function(){
$('img#M14_close').click(function(){
$(this).hide();
$('#panneleft').animate({marginLeft: '-=200px'}, "slow");
$('img#M14_open').show();
});
});



a++

[Space Sapien]

Merci beaucoup Milouze, c'est tout à fait ce que je recherchais

et merci à toi pour ta proposition Oxymore, je ne savais pas qu'il existait des générateurs de code