Центрируйте и поверните изображение с помощью IE8 (jQueryRotate)

Question

Все,

Я ищу способ центрировать и поворачивать изображение в ответ на нажатие кнопки.Я использую библиотеку jQueryRotate.

Вот подход, который я рассматривал.

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

Это прекрасно работает в Chrome / Firefox, но не в IE8 или ниже,Есть некоторые артефакты изображения, от которых я не могу избавиться.Есть идеи?

PS У меня нет строгих требований к тому, как осуществляется ротация, поэтому приветствуются и другие подходы.

PSS Я могу опубликовать код, если ссылки JSFiddle вам не нравятся.

Answer 1

В итоге я решил проблему, используя функцию поворота BasicImage в IE.Мне нужно было только показать изображения с шагом в 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

Привет, я являюсь автором этого плагина, и я приветствую любые комментарии и вопросы по поводу этого плагина на домашней странице плагина:)

Можете ли вы объяснить немного больше вашей проблемы, поскольку я не могу воспроизвести ее в IE 8 или IE7, эмулированную в IE8. Также было бы неплохо создать вопрос:)

Единственная «странная» проблема, с которой я столкнулся, это просто эффект загрузки изображения, от которого можно легко избавиться, если после загрузки страницы вы просто выполните $ (img) .rotate (0) ->, чтобы убедиться, что при нажатии на изображение оно будет готово к анимации:)

Приветствия

Answer 3

Вы пытались использовать RaphaelJS вместо этого. С этой библиотекой у меня был хороший опыт работы с несколькими браузерами.

Поворот изображений с Рафаэлем по клику - простая задача, посмотрите на эту демонстрацию: http://raphaeljs.com/image-rotation.html