0

I'm usin Jquery Rotate Plugin for rotating a picture and save the new angle of rotation of it. When someone restart the rotation of this picture, I would like to restart at the same angle but the rotation stop at it's original point and don't loop like the same time I rotate it.

Thannks for your help :)

var anglestop = 0;
$('.rotate').click(function() {
    var rotation = function (){

    $('#image').rotate({
      angle:anglestop,           
      animateTo:360, 
      duration: 3000,
      callback: rotation,
      easing: function (x,t,b,c,d){
        return c*(t/d)+b;       
    },
      bind: {
        click: function(){
          $(this).stopRotate();
          anglestop=$(this).getRotateAngle();
      }}
     });
  }

  rotation();  
});
slig36
  • 187
  • 3
  • 13

1 Answers1

0

Check this out:

var anglestop = 0;
var rotating = false;

function toggleRotate(event) {
    if (event && event.type == "click") {
        if (rotating) {
            $(this).stopRotate();
            anglestop = $(this).getRotateAngle();
            rotating = false;
            return;
        }
    } else {
        anglestop = 0;
    }        

    $(this).rotate({
      angle:anglestop,           
      animateTo:360,
      duration: 3000 * (360 - anglestop) / 360,
      easing: function (x,t,b,c,d){
        return c*(t/d)+b;       
      },
      callback: toggleRotate
    });
    rotating = true;
}

$("#image").click(toggleRotate);

Here is the working example.

Adrian Ber
  • 20,474
  • 12
  • 67
  • 117
  • Your exemple has the same problem as my code. When you restart the rotation, "google" stop at it original angle and don't loop as the first time :( – slig36 Dec 24 '12 at 11:25
  • I updated the code and made it work. There were few problems: event handler getting bind multiple times, when the rotation was restarted the anglestop was the one from the previous stop and the time must be proportional to anglestop to have the same speed. – Adrian Ber Dec 25 '12 at 01:30