vetero4eg
@vetero4eg
Пишу, верстаю, правлю.

Почему не срабатывает transform-origin в IE и Edge?

Не могу понять в чем дело... По caniuse поддержка есть, префикс для гарантии указан, но свойство не работает в указанных браузерах.

Есть вот такая вот анимация vetero4eg.github.io/Demo/prorok.html

для точек нужный центр указан..
-webkit-transform-origin: 131px 77px;
-ms-transform-origin: 131px 77px;
transform-origin: 131px 77px;

что не так?

пыталась задавать transformOrigin через TweenMax но тогда не работает вообще везде...
указывала так TweenMax.set('.dot', {transformOrigin: "131px 77px"});
  • Вопрос задан
  • 86 просмотров
Решения вопроса 1
sfi0zy
@sfi0zy
UI developer. Верстаю неверстаемое.
По caniuse поддержка есть

Ну вообще-то не совсем, там есть сноска №1, где говорится, что IE и Edge "Does not support CSS transforms on SVG elements".

для точек нужный центр указан..

Уберите его из CSS и используйте матрицу вместо scale:
TweenLite.from("...", 1.5, { transform: "matrix(0, 0, 0, 0, 131, 77)" });
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@profesor08
Потому что надо делать на canvas, а не выворачивать себе мозги, пытаясь сделать на svg и css. В IE и Edge плохая поддержка svg, и для SVG не работает transform-origin. Смирись и ищи обходной путь. Хоть каждую точку по отдельности аниммируй.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Biganto Москва
от 130 000 до 130 000 руб.
Soft Media Int. Пенза
от 125 000 до 225 000 руб.
от 120 000 до 150 000 руб.
18 авг. 2018, в 11:06
10000 руб./за проект
18 авг. 2018, в 10:13
500 руб./в час
18 авг. 2018, в 09:13
13000 руб./за проект