faire pivoter une image plusieurs fois sur cliquez avec jquery

Question

J'essaye de faire pivoter une image en utilisant jquery qui tournera sur plusieurs clics de souris. En utilisant le plugin jquery-rotate, le code suivant ne fait pivoter l'image qu'une seule fois (en se transformant en canvas dans firefox) et ne tournera plus sur d'autres clics.

$(".drag-and-rotatable img").click(function() { 
    $(this).rotate(45); 
}); 

Je suis ouvert à l'utilisation d'autres bibliothèques JavaScript.

Answer 1

Lorsque vous dites rotate(45), vous faites pivoter l'image de 45 degrés? (Assurez-vous qu'il n'est pas radians, je ne pas utiliser le plug-in) de la rotation d'origine, donc si vous voulez garder la rotation, vous devez continuer à ajouter ou soustraire des degrés:

$(function() {         // doc ready 
    var rotation = 0;        // variable to do rotation with 
    $(".drag-and-rotatable img").click(function() { 
     rotation = (rotation + 45) % 360; // the mod 360 probably isn't needed 
     $(this).rotate(rotation); 
    }); 
});