shake css issue with translation of svg group

У меня есть пчела, которую я пытаюсь оживить, но по какой-то причине они переведены в верхнюю часть окна просмотра.shake css issue with translation of svg group

вот моя ручка:

http://codepen.io/vannygee/pen/BpqVeX

Сначала я подумал, что это проблема, но ИДК ..

display: inline-block; 
transform-origin: center center;

Любой знакомый с сотрясения CSS?

источник

2017-02-09 van

Взгляните на BlogPost GreenSock в о SVG трансформирует: https://greensock.com/svg-transforms

Я считаю, что основная суть в том, что перевести свойство в некоторых браузерах относительно ViewBox в SVG, а не элемент/пути вы таргетирование , GSAP - мое решение для этого, потому что оно превращает трансформации в матричные преобразования, чтобы компенсировать эту проблему.

источник

2017-02-09 16:47:54 Alejalapeno

Спасибо, я посмотрю Я замечаю, что крылья в моем файле имеют странный перевод (и поворот). Я не понимал, что если бы я повернул файл в эскизе (перевернул как по вертикали, так и по горизонтали), он применил бы перевод. Возможно, я сделаю это снова с нуля, путь к пути – van

Похоже, вы правы. Если вам нужна широкая поддержка браузера, я бы посмотрел на GSAP, но в остальном это похоже на то, что трансформации наследуются в вашем SVG, что является проблемой. – Alejalapeno

все в порядке, поэтому я посмотрел в GSAP, и я подумал, что посмотрю, была ли это моя ошибка svgs, посмотрите, насколько это смешно: http://codepen.io/vannygee/pen/bgmxeo – van

shake css issue with translation of svg group

ответ

Смежные вопросы