Question

所有

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

这是我正在考虑的方法。

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

这适用于Chrome / Firefox，但不适用于IE8或更低版本。有一些我无法摆脱的图像文物。有任何想法吗？

P.S。我对旋转的完成方式没有严格的要求，所以也欢迎其他方法。

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

Answer 1

我最终通过在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 + ')');
        }

Answer 2

您是否尝试过使用RaphaelJS。有了这个库，我过去有很好的跨浏览器体验。

点击raphael旋转图像是一项简单的任务，请看一下这个演示：http://raphaeljs.com/image-rotation.html

Answer 3

您好我是这个插件的作者，我欢迎在插件主页上有关此插件的任何评论和问题：）

你能解释一下你的问题，因为我无法在IE8或IE8中模拟的IE7中重现它。创建问题也很好：）

我看到的唯一“奇怪”问题只是加载图像效果，如果在加载页面后你只需要做一个$（img）.rotate（0） - ＆gt;就可以轻松摆脱它。这将确保当您单击图像时，它将准备动画：）

干杯，

中心和使用IE8（jQueryRotate）旋转图像

3 个答案: