开发者

How to rotate with Pixastic jquery more than once?

开发者 https://www.devze.com 2023-04-12 17:29 出处:网络
I try to rotate my image when I click(using Pixastic) but I can only rotat开发者_StackOverflow中文版e 1 time, how can I go on rotating each time I click to the image

I try to rotate my image when I click(using Pixastic) but I can only rotat开发者_StackOverflow中文版e 1 time, how can I go on rotating each time I click to the image

$('#tok').click(function() {
                $("#tok").pixastic("rotate", {angle:90});                   
            }); 


I have NOT used Pixastic before. But, I believe, everytime the image is clicked , you have to increase the angle 90 .

First Click -> 90 
Second Click->180 
Third Click ->270
Fourth Click ->360
Fifth Click ->90..etc

Updated:

It seems Pixastic remove the image first and insert it again. That's why onClick handler is executed once. Change it to "live" and it will work.

$('#tok').live('click',function() {
     $(this).pixastic("rotate", {angle:90});                 
});

Check Demo : here.


If you want to rotate it finer than 90 degree, you could also use the HTML5 range Element (or a workaround for deprecated browsers ( like IE 9 and below ;-) )

HTML (5)

<input type="range" id="rotate" min="-180" max="180" value="0" step="1">

jQuery

$('.rotate').live('change', function(){
    $('img').pixastic("rotate", {angle: $(this).val() });
}

Kind regards to Jacob Seidelin for his great plugin!

0

精彩评论

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