Sunday, May 1, 2011

Web: solution for image rotate and zoom

I have a web page which displays a large image, for example a page from a magazine. I have no control over the image size or orientation. It's possible that the image may need to be rotated by the user to orient it correctly.

Are there any Javascript or Flash solutions that will allow someone to rotate and zoom a given image? Ideally I'd specify a single image and the dimensions to use when displaying it. If the image is larger than those dimensions, the user could zoom in and view a portion of the image in greater detail.

From stackoverflow
  • I've seen a couple of solutions for rotating images with straight Javascript and CSS. Raphael would do the trick. There is apparently even an example featuring rotating an image. (it uses SVG but is support on all major browsers)

    This one is not cross browser, but is an interesting exercise nevertheless.

    As for flash rotation etc...

    August Lilleaas : Thumbs up for using SVG!
  • For rotating images, I used jquery-rotate and it works very well.

    It is not totally cross-browser, it doesn't work with IE6 (and probably other old browsers).

    For zooming, I guess you could make your own implementation using javascript, you can just resize the image (easy with jQuery).

    altCognito : It also doesn't work with Safari/Chrome, just FYI
    GoodEnough : Really? I thought it worked with WebKit, nvm then


Post a Comment