开发者

rotate an image multiple times on click with jquery

开发者 https://www.devze.com 2023-01-25 10:47 出处:网络
I am trying to rotate an image using jquery that will rotate on multiple mouse clicks. Using the jquery-rotate plugin, the following code only rotates the ima开发者_开发知识库ge once (transforming to

I am trying to rotate an image using jquery that will rotate on multiple mouse clicks. Using the jquery-rotate plugin, the following code only rotates the ima开发者_开发知识库ge once (transforming to a canvas in firefox) and will no longer rotate on further clicks.

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

I'm open to using other JavaScript libraries.


When you say rotate(45), you are rotating the image 45 degrees? (make sure it's not radians, I don't use the plugin) from the original rotation, so if you want to keep rotating you have to keep adding or subtracting degrees:

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

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号