中心与使用 IE8 旋转图像 (jQueryRotate)

Question

所有，

我正在寻找一种方法来中心和旋转图像以响应按钮单击。我正在使用 jQueryRotate 库。

这是我正在考虑的方法。

http://jsfiddle.net/HatAndBeard/k3Gxj/6/

这在 Chrome/Firefox 中运行良好，但在 IE8 中不起作用或更低。有一些图像伪影我无法消除。有什么想法吗？

PS 我对如何进行轮换没有严格要求，因此也欢迎其他方法。

PSS 如果 JSFiddle 链接不符合您的喜好，我可以发布代码。

Answer 1

你好，我是这个插件的作者，我欢迎在插件的主页上提出有关此插件的任何评论和问题:)

你能解释一下你的问题吗，因为我无法让它在 IE 8 或 IE8 中模拟的 IE7 中重现。创建问题也很好:)

我看到的唯一“奇怪”问题只是加载图像效果，如果加载页面后您只需执行 $(img).rotate(0) ->，您可以轻松摆脱该效果;这将确保当您单击图像时，它将准备好制作动画:)

干杯，

Answer 2

您是否尝试过使用 RaphaelJS 来代替。通过这个库，我过去拥有良好的跨浏览器体验。

点击时使用 raphael 旋转图像是一项简单的任务，看看这个演示：http://raphaeljs.com /图像旋转.html

Answer 3

我最终通过使用 IE 中的 BasicImage 旋转功能解决了这个问题。我只需要以 90 度增量显示图像，因此这种方法是可行的。

我所做的粗略草图...

function ieRotate(element, rotation) {
            var rotationInt = 0;
            switch (rotation % 360) {
                case 0:
                    rotationInt = 0;
                    break;
                case 270:
                case -90:
                    rotationInt = 3;
                    break;
                case 180:
                case -180:
                    rotationInt = 2;
                    break;
                case 90:
                case -270:
                    rotationInt = 1;
                    break;

            }
            element.css('filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation=' + rotationInt + ')');
        }