поверните изображение несколько раз при нажатии с помощью jquery

Question

Я пытаюсь повернуть изображение, используя jquery, который будет вращаться несколькими щелчками мыши. Используя плагин jquery-rotate , следующий код поворачивает изображение только один раз (трансформируется в холст в Firefox) и больше не будет вращаться при последующих щелчках.

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

Я открыт для использования других библиотек JavaScript.

Answer 1

Когда вы говорите rotate(45), вы поворачиваете изображение на 45 градусов?(убедитесь, что это не радианы, я не использую плагин) из исходного вращения, поэтому, если вы хотите продолжать вращать, вы должны продолжать добавлять или вычитать градусы:

$(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);
    });
});