使用javascript在div内顺时针或逆时针旋转图像

Question

HI，有没有办法可以顺时针或逆时针旋转div内的图像。

我有一个主要的固定宽度div [溢出设置为隐藏]与从数据库加载的图像。 有一个滚动条，用于显示div内的图像。 单击图像时，我需要以顺时针或逆时针方向显示旋转动画。

我使用Matrix过滤器完成了它。 我想知道是否可以在IE中完成而不使用任何过滤器。

Answer 1

试试这个： http ： //raphaeljs.com/image-rotation.html

使用canvas但也支持IE

Answer 2

如果你正在使用jQuery，jQueryRotate是一个小的（小于3Kb缩小+ gzip）插件，可以旋转图像：

http://jqueryrotate.com/

Answer 3

在IE中，我能想到在客户端旋转图像的唯一方法是使用过滤器。 对于某些最新版本的其他浏览器，您可以使用<canvas>控件 。

您可以选择使用服务器端脚本来旋转图像。 然后您可以发送有关如何使用JavaScript旋转它的信息（即生成图像的路径，例如/rotate?image=img.jpg&amount=90）

Answer 4

CSS3支持旋转 ，但不受广泛支持 。 正如你要求的JavaScript解决方案， 这是一个 ，但我认为你不能得到流畅的图像。

Answer 5

还有其他方法来旋转图像，没有任何过滤器/ html5 ..它在现实世界中是令人讨厌和无用的，但可能。

对于javascript，您可以将图像存储为像素数组。 写函数用它来执行旋转并将其编码为base64 datauri，bmp可以很容易并用它替换image.src。

旧浏览器中的文件大小和支持会有一些限制，当然还有可怕的性能。