Ajouter .slidetoggle à un script

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Ajouter .slidetoggle à un script

Message par Space Sapien le Lun 23 Mar 2015 - 19:28

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 ? Smile


Dernière édition par Space Sapien le Dim 29 Mar 2015 - 10:56, édité 1 fois

Space Sapien
***

Masculin
Messages : 183
Inscrit(e) le : 28/07/2013

http://deliriums.forumgratuit.org
Space Sapien a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter .slidetoggle à un script

Message par Space Sapien le Mar 24 Mar 2015 - 19:07

Up

Space Sapien
***

Masculin
Messages : 183
Inscrit(e) le : 28/07/2013

http://deliriums.forumgratuit.org
Space Sapien a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter .slidetoggle à un script

Message par Space Sapien le Mer 25 Mar 2015 - 23:08

Up

Space Sapien
***

Masculin
Messages : 183
Inscrit(e) le : 28/07/2013

http://deliriums.forumgratuit.org
Space Sapien a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter .slidetoggle à un script

Message par Space Sapien le Ven 27 Mar 2015 - 9:44

Up

Space Sapien
***

Masculin
Messages : 183
Inscrit(e) le : 28/07/2013

http://deliriums.forumgratuit.org
Space Sapien a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter .slidetoggle à un script

Message par oxymore le Sam 28 Mar 2015 - 14:47

Bonjour

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

oxymore
**

Messages : 85
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter .slidetoggle à un script

Message par Milouze14 le Dim 29 Mar 2015 - 8:22

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++

Milouze14
+ Hyperactif +

Masculin
Messages : 4577
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter .slidetoggle à un script

Message par Space Sapien le Dim 29 Mar 2015 - 10:55

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

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

Space Sapien
***

Masculin
Messages : 183
Inscrit(e) le : 28/07/2013

http://deliriums.forumgratuit.org
Space Sapien a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum