Registered User
Registered User

Reputation: 1564

Trying to rotate a button in jquery?

I'm trying to rotate a button in jquery!

This is what I've created on jsfiddle

http://jsfiddle.net/QVKjt/1/

jquery code

$("#no").rotate({ 
    angle:0,
        bind: {
            click : function(){
                var curAngle = parseInt($(this).getRotateAngle());
                $(this).rotate({
                    angle: curAngle,
                    animateTo: curAngle + 30
                });
            }
        }
   });

Upvotes: 1

Views: 1725

Answers (3)

Maybe this is help you.

$("#no").rotate({ 
angle:0,
    bind: {
        click : function(){
            $(this).rotate({
                angle: 0,
                animateTo:  30
            });
        }
    }
});

Check the demo : http://jsfiddle.net/QVKjt/8/

Upvotes: 1

Chirag Vidani
Chirag Vidani

Reputation: 2577

Try this

var rotation = 0;

jQuery.fn.rotate = function(degrees) {
    $(this).css({'-webkit-transform' : 'rotate('+ degrees +'deg)',
                 '-moz-transform' : 'rotate('+ degrees +'deg)',
                 '-ms-transform' : 'rotate('+ degrees +'deg)',
                 'transform' : 'rotate('+ degrees +'deg)'});
};

$('#no').click(function() {
    rotation += 30;
    $(this).rotate(rotation);
});

Check the fiddle demo

Upvotes: 2

Guilherme Oderdenge
Guilherme Oderdenge

Reputation: 5001

.rotate() isn't an official jQuery function and you need to load it manually.

To do this, download the library by clicking here and refer to your application using this:

<script type="text/javascript" src="js/jQueryRotate.2.2.js"></script>

In jsFiddle I just add an external library. To see working, click here.

Upvotes: 2

Related Questions