Jquery :: Animation Toggle Div onclick...

Résolu/Fermé
Geishin Messages postés 9 Date d'inscription mardi 20 mai 2014 Statut Membre Dernière intervention 30 juin 2014 - Modifié par Geishin le 20/05/2014 à 19:17
Geishin Messages postés 9 Date d'inscription mardi 20 mai 2014 Statut Membre Dernière intervention 30 juin 2014 - 22 mai 2014 à 08:21
Bonjour à tous.

Voilà 2 heures que je me casse la tête à réaliser un script Jquery. Pourrire-vous m'aider ? :) C'est très simple, il me faudrait :
- Un bloc DIV qui, lorsque je clic sur le bouton '#reg', se déplace de 200px à gauche (.animate()) et reste à cette position, puis se replace à la position d'origine (.animate()) si je re-clic sur le bouton '#reg'...

Ici mon script :
var click= $('#reg').click();

if (click == true){
 $('#regdiv').animate({left: "-=200"}, 2000);
 if (click == true){
  $('#regdiv').animate({left: "+=200"}, 2000);
  }
 else {
 }
}
else{
}


Je vous remercie de votre attention :)
A voir également:

2 réponses

animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 738
Modifié par animostab le 21/05/2014 à 05:32
salut

voila comment on fait avec toggle qui switch entre les 2 fonctions a chaque clic

Déjà
1) mettre une position à #regdiv (relative , absolute etc ) avec du css sinon animate ne fonctionne pas (c'est bête mais c'est comme ca)

2) ne pas oublier d'appeler jquery (avant le script suivant)

<script>
$(document).ready (function(){
$("#reg").toggle(function(){
$("#regdiv").animate({left: "-200px"},2000);
},function(){
$("#regdiv").animate({left: "200px"},2000);
});
})
</script>

et voila ! c'est pas joli ca ?

Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.
0
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 738
21 mai 2014 à 14:20
OUps
pour que ca se replace à la position d'origine dans la 2eme function mets
$("#regdiv").animate({left: "0px"},2000);

voila
0
Geishin Messages postés 9 Date d'inscription mardi 20 mai 2014 Statut Membre Dernière intervention 30 juin 2014
22 mai 2014 à 08:21
Ok je te remercie pour la réponse ! :)
0