Take the 2-minute tour ×

I have a basic understanding on jQuery's animate() method and properties, but I want to take it even further...What resources do developers study to help rotate images via JavaScript / jQuery?

My current thought process is assuming that there are mathematical functions that you can store into variables and plug into the animate() jQuery sequence in order to see an object rotate 180 degrees on click. then when you click the object again, it rotates another 180 degrees.

My end goal is to have a < div > which uses a css background image, to all be rotated. The image itself will be a png file with transparency to help make the rotation appear more seamless. If that sounds stupid, please let me know - but that is what I'm picturing in my head...

I'm just looking for direction on learning this process


share|improve this question
Depending on exactly what you are looking for, CSS may be easier. Is there a specific reason it needs to be Javascript/jQuery? –  mookamafoob Jan 31 '13 at 14:49
I was thinking of CSS3 to do that while driving to work, but then it hit me that not too many browsers support that - Chrome will for sure, but everyone else may not... I want it to be JavaScript based this way it works in more browsers. - That's my reason –  blackhawk Jan 31 '13 at 14:53
JavaScript cannot do that directly, it can only be using to manipulate the related CSS properties, or a canvas. –  bfavaretto Jan 31 '13 at 14:59
add comment

closed as not a real question by Will Feb 3 '13 at 21:48


1 Answer

up vote 0 down vote accepted

You can either manipulate the CSS transform properties, or add the image to a canvas element, where you can use a native rotate method, or manually reposition the image's pixels.

share|improve this answer
My only question to that is which direction is supported in more browsers... –  blackhawk Jan 31 '13 at 14:55
add comment
