Анимация кадра SVG

Мне было любопытно, может ли кто-нибудь указать мне правильное направление, чтобы иметь возможность делать анимацию SVG, где она по существу циклически переключает видимость сгруппированных элементов, так что, по сути, у вас есть покадровая анимация. Код анимации должен быть встроен в SVG и должен быть совместим с IE, Firefox и Chrome. До сих пор, после бесчисленных часов попыток разных вещей, я заставил его работать только в Chrome.


svg svg-animate
person Chris Burke    schedule 27.10.2016    source источник
comment
IE не выполняет анимацию SMIL или CSS, поэтому вам нужно использовать библиотеку анимации javascript или кодировать ее самостоятельно.   -  person Robert Longson    schedule 28.10.2016
comment
Хорошо, мне сообщили, что я могу забыть о совместимости с IE и просто сделать его совместимым с Firefox и Chrome. Можно ли сделать это, сохраняя совместимость между этими двумя браузерами?   -  person Chris Burke    schedule 28.10.2016
comment
В этом случае используйте анимацию SMIL или CSS.   -  person Robert Longson    schedule 28.10.2016
comment
Можно ли встроить анимацию SMIL или CSS непосредственно в код файла SVG? Я пытался сделать это, но это не сработало...   -  person Chris Burke    schedule 28.10.2016
comment
Конечно, можете, опубликуйте код в своем вопросе, и я исправлю его, если он достаточно короткий.   -  person Robert Longson    schedule 28.10.2016
comment
Ну, это код, который у меня есть прямо сейчас, мне не нравится затухание, я бы предпочел просто циклически включать и выключать кадры. codepen.io/chrisbtbi/pen/wzbJNo   -  person Chris Burke    schedule 28.10.2016
comment
Кстати, кода много, но код анимации очень короткий и в конце каждой группы элементов.   -  person Chris Burke    schedule 28.10.2016

Ответы (1)


arrow_upward
2
arrow_downward

Спецификация SMIL говорит, что числа не могут начинаться с . так что вам нужно

dur="0.1s"

Измените это, и, похоже, это сработает в Firefox, то есть лезвия выглядят так, как будто они движутся, что, по-видимому, вы и пытаетесь сделать. Chrome менее строг и позволяет вещи, которые технически недействительны.

Вероятно, вы могли бы заставить это работать в IE, используя библиотеку эмуляции SMIL, такую ​​как fakeSmile.

person Robert Longson    schedule 27.10.2016
comment
Потрясающий! Большое спасибо, Роберт! - person Chris Burke; 28.10.2016