How do i animate this rotation?
This library rotates an image.
http://jsfiddle.net/PjDnu/
In the above example, it does rotate, but i want to animate it. i use setInterval() , but it doesn't work:
window.onload = function(){
var elem = document.getElementById("im");
setInter开发者_C百科val(function (){Rotate(elem, Math.PI/6)}, 1000/30);
}
Is there a chance to animate it? What is the right way to use this library?
Fiddle: http://jsfiddle.net/PjDnu/10/
The <img>
element doesn't exist after executing Rotate
. I've adjusted the code, so that the image keeps rotating. To accomplish this, I have made the following modifications:
- Created a container element after the original image - the original image has to be kept to dynamically calculate the new image.
- Added a counter in the scope of the interval (to keep track of the current/next angle)
- Added a third parameter (at the second position) to
Rotate
: This should be the container element, with an unique ID.
Why you are using JS? This will do it using CSS3 (which is much better) - http://jsfiddle.net/hUUYN/ The basic idea there is that you add the class 'spin2' to each image you wish to rotate...
精彩评论