Modifier la width d'un element avec .animate()

Par stalker069, il y a 10 ans


Bonjour,

Voila je rencontre un petit problème avec mon code. J'ai plusieurs rectangle quand je click sur un rectangle ça augmente la lageur de 20% et tous les autres rectangle récupere lrus dimension d'origine.

$('.task').click(function () { //si le rectangle n'est pas agrandie sinon on ne fait rien if(!$(this).hasClass('active')){ //on recupere la taille d'origine var width = $(".active").attr("data-size"); //on modifie la taille avec un animation $(".active").animate({ width: "-=" + width }); //on supprimer les class active $('.task').removeClass('active'); //on recupere la taille de base et on ajoute 20% du rectangle selectionné var size = $(this).width(); size = size * 1.2; //on lui ajoute la classe active pour savoir lequel est agrandi $(this).addClass('active'); //on l'agrandi avec une animation $('.active').animate({ width: "+=" + size }); } });

Quand je click sur mon rectangle la gestion des class active fonctionne ainsi que l'augmentation de 20% de la largeur.
Mais mes anciens rectangle selectionné grade leurs taille avec ces fameux 20% alors qu'il devrais éffectué l'animation de -20%.
Merci pour votre aide

Afin d'aider à la compréhension de mon probleme voici tout le code (html css jquery) https://jsfiddle.net/stalker069/r43p6274/11/

1 réponse

Azorgh, il y a 10 ans

Hello,

Voici ton JSFiddle modifié. J'espère que tu comprendras les modifications, sinon, n'hésite pas à nous poser des questions :)

https://jsfiddle.net/r43p6274/13/