Comment obtenir la propriété d'un élément après transformation?

Question

Je suis en train de faire une transformation de la largeur d'un élément. Dans ma jquery j'ajoute une classe, et dans la css je décris la transformation. Si je demande maintenant avec jquery la largeur de cet élément après avoir ajouté la classe, j'obtiens la largeur actuelle de cet élément, mais ce n'est pas la largeur finale de cet élément. Comment obtenir la largeur finale? Y a-t-il un événement, une transformation terminée ou quelque chose comme ça? Dois-je utiliser un timeout ou une montre jquery?

/Sincères salutations Christian

EDIT: Encore mieux maintenant: JSFiddle

Sur la première cliquez sur la largeur de la méthode() retourne 100, après la transformation, il retourne 200. Comment obtenir le résultat sur le premier clic?

Answer 1

Assurez-vous que l'élément que vous transformez possède un type de bloc d'affichage (affichage: bloc), sinon vous ne pouvez pas modifier la largeur de l'élément.

Html:

<a href="#">Bigger</a> 

Jquery:

$('a').click(function(e){ 
    console.log($(this).width()); 
    $(this).addClass('bigger'); 
    console.log($(this).width()); 
}); 

CSS:

a { 
    width:100px; 
    background: #ccc; 
} 
.bigger { 
    width: 200px; 
} 

code