问题
HI, Is there a way by which I can rotate an image inside a div clockwise or anticlockwise.
I have a main fixed width div[overflow set to hidden] with images loaded from database. There is a scroll bar for showing the images inside the div. When image is clicked then I need to show the rotating animation either in clockwise or anticlockwise direction.
I have done it using Matrix filter. I would like to know whether it is possible to be done in IE only without using any filters.
回答1:
try this: http://raphaeljs.com/image-rotation.html
uses canvas but also supports IE
回答2:
If you're using jQuery, jQueryRotate is a small (less than 3Kb minified+gzipped) plugin that rotates images:
http://jqueryrotate.com/
回答3:
The only way I can think of for rotating images on the client-side in IE is using filters. For somewhat recent versions the other browsers you can use the <canvas> control.
Your alternative is to use a server-side script to rotate the image. Then you can send the information on how to rotate it with JavaScript (i.e. generate a path to the image such as /rotate?image=img.jpg&amount=90)
回答4:
CSS3 supports rotation, but it isn't widely supported. As you asked for JavaScript solution, here's one, but I don't think you can get smooth images.
回答5:
There is other way to rotate images without any filters / html5.. it's nasty and useless in real world, but possible.
You can store your image as array of pixels, for javascript. Write function to perform rotation with it and encode it to base64 datauri, bmp could be easy and replace image.src with it.
There will be some limitation about filesize and support in old browser and of course terrible performance..
来源：https://stackoverflow.com/questions/968642/rotate-image-clockwise-or-anticlockwise-inside-a-div-using-javascript