views:

168

answers:

3

I've seen a few JavaScript image rotators that use either the HTML5 canvas element or an AJAX call to a server-side script, but is it possible to do it without using those methods? Internet Explorer doesn't support canvas (I'm aware of excanvas, but I'd like to do without if possible) and I'm not sure if AJAX will be fluid enough. If there is a way, are there any open source scripts, examples, or resources that you could point me to?

+3  A: 

Alas, CSS does not support rotating images in any way, shape or form (unless you count CSS Transforms, which are only supported by Safari 4 and Firefox 3.1).

Your best bet is to use Raphael's image() and rotate(), which should support all semi-modern browsers (using SVG) and most versions of IE (using VML).

Luke Dennis
+1 for Raphael's script. I hadn't seen that before.
VirtuosiMedia
+1  A: 

Google is your friend: http://www.walterzorn.com/rotate_img/rotate_img.htm

But the downside of this technique (as mentioned) is that it uses hacks by inserting a huge number of DIVS so it could slow down the browser a good bit. Use with caution. Problems like this are why the canvas tag was created in the first place.

Greg
Thanks. I had run across that script previously, but wasn't sure about the method or how it would stand up to photos, etc.
VirtuosiMedia
+1  A: 

This jQuery plugin works in major browsers including IE: http://wilq32.googlepages.com/wilq32.rollimage222 . It makes use of excanvas, but at least it allows you to evaluate if that method is good enough for your purposes.

Thomas Petersen