使用Javascript旋转图像

Question

首先，我目前正在使用JQuery，因此JQuery解决方案是可行的。

---

我想将图像旋转每秒钟计算一次的动态X度。

现在我可以使用此JqueryRotate插件完美运行

图像每秒钟完美旋转一次。 但是我现在正在尝试一些更复杂的事情。

我想彼此旋转4个透明图像。 目前，我有四个<img>标记，它们都正确对齐并且看上去很漂亮^ _ ^，但是使用前面提到的JqueryRotate插件会强制重新绘制图像以旋转图像，从而失去透明度，因此仅显示最上面的图像，这显然无法正常工作。

那么，什么是一个好的库/插件或在保持透明度的同时旋转图像的方式呢？*

必须在Opera，Safari，Chrome，Firefox和IE8 +中运行

我希望不必为此包括另一个库，但是如果需要的话，我会这样做以产生旋转4张图像的效果。 提前致谢。

Answer 1

Raphael是一个很棒的库，可在IE（带有VML）和其他浏览器（带有SVG）中工作。 它可以旋转图像并处理透明度。

我不知道有什么其他方法可以处理IE。 CSS解决方案非常简单，但是在IE中不起作用。

另一个选择是使用CSS精灵来模拟图像旋转 （ 该示例模拟了3d旋转，但是2d同样简单 ）。

Answer 2

好吧，即使使用jQueryRotate插件也可以使用 ，您是否问过作者（我）呢？ ：PI不要经常阅读stackoverflow来回答这种请求:)

Answer 3

您可以看看使用Canvas。 IE 8没有本机支持，但是有一个插件： http : //ajaxian.com/archives/explorer-canvas-updated-for-ie-8-and-more 。

如果您愿意接受插件要求，那么Canvas应该使您的工作变得轻松。

Answer 4

您最好的机会是使用canvas并使用IE canvas hack。

像大多数其他IE hack一样，针对IE的CSS轮换使用filter属性，几乎可以肯定会干扰用于透明图像的filter hack和用于更改不透明度的filter hack。

另一方面，canvas hack使用本地VML代替，它可以处理您需要的一切。

http://code.google.com/p/explorercanvas/

我不知道它的表现如何，所以您的行程可能会有所不同。