Thursday, January 29th, 2009

Rotate images with Canvas jQuery plugin

Category: Canvas, jQuery

Pawel Witkowski released an interesting jQuery plugin called Wilq32.RotateImage that lets you rotate images simply:


  1. // just do it 5 degrees
  2. $('#image2').rotate({angle:5});
  4. // animate the rotation
  5. var rot=$('#image3').rotate({maxAngle:25,minAngle:-55,
  6.   bind: [
  7.     {"mouseover":function(){rot.rotateAnimation(85);}},
  8.     {"mouseout":function(){rot.rotateAnimation(-35);}}
  9.   ]
  10. });

You can also do this type of thing on new browsers via CSS transforms so it would be cool to merge the two (if one is supported great, else try the other).

Posted by Dion Almaer at 4:20 am

2.7 rating from 6 votes


Comments feed TrackBack URI

Hm, low quality script, the first two examples dont run at Firefox 3 and at IE 6 the images are clipped and the browser crashed.

Comment by Semikolonne — January 29, 2009

This is still work in progress stuff – There still some minor bugs with loading images. Refreshing should help solve this bug.

Comment by wilq32 — January 29, 2009

Actually both of IE and other browsers bugs are solved (except one minior one with IE events but whole effect works)

Comment by wilq32 — January 29, 2009

Leave a comment

You must be logged in to post a comment.