Annuler effet fonction JS

Bonjour,

J'ai un petit soucis concernant une fonction que j'utilise pour mon futur site.

Cette fonction fait tout simplement grossir et bouger des images lorsque l'on clique dans la div où elles se trouvent. Chaque image se trouvant elle même dans une div.

Mais le soucis c'est que je n'arrive pas à trouver un moyen de faire revenir ces éléments à leur position et taille initiale. J'ai déjà créer une div dans laquelle j'ai mis une image et une fonction "onclick" et c'est donc par le biais de celle ci que j'aimerai "réinitialiser" la fonction précédente.

Il me faudrait donc un moyen d'annuler les fonction grâce à une autre fonction.

Merci d'avance !

Le plus simple est d'accomplir l'effet en ajoutant une classe CSS aux éléments par exemple avec des propriétés transform.

En la retirant avec JS, les éléments retrouvent leur état initial.

En effet, ça à l'air de mieux fonctionner. Cependant il me reste un soucis, lorsque je créer ma classe et que je le rentre les propriétés dedans, seulement la dernière propriété est prise en compte...

voici le code :

Le css :

.scaleup{

transform: translatex(-150px);
transform: translateY(-100px);
transform: scale(3,3);
}

Et le JS :

$(document).ready(function(){
$("#test_main img").click(function(){
$("#test").addClass("scaleup");
});
});


cordialement.

C'est normal. Il faut mettre toutes les transformations sur la même ligne si tu veux qu'elles s'appliquent toutes :

.scaleup{
 transform: translatex(-150px), translateY(-100px), scale(3,3); 
}

Je viens d'essayer et ça ne marche toujours pas... il fait plus rien pour le coup.
Modifié par milkadonf (12 Nov 2015 - 10:47)

C'est bon enfaite ça marche très bien ! il fallait juste retirer les virgule entre les propriétés.

a écrit :
C'est bon enfaite ça marche très bien ! il fallait juste retirer les virgule entre les propriétés.

Oh désolé, au temps pour moi ! Je n'ai pas vérifié avant de poster, j'étais à peu près sûr qu'il y avait bien des virgules.