Анимация в отдельном SVG (с ecmascript (и jQuery ?!))

Question

Я создал SVG с использованием inkscape, и теперь я хочу добавить анимацию в соответствии с некоторой логикой.

Я достаточно хорошо знаю JavaScript и имею базовый опыт работы с jQuery.Поэтому я подумал, что могу анимировать SVG и с помощью jQuery.

Google находит бесчисленные учебники по работе со встроенным SVG, встроенным в XHTML, но у меня есть отдельный SVG, и Firefox жалуется

Ошибка: b.style не определен

Исходный файл: [...] jquery.js

Строка: 16

Есть ли способзаставить работать jQuery?Или, в качестве альтернативы, вы можете порекомендовать другую библиотеку JavaScript, которую я мог бы использовать, которая удовлетворяет этой цели?

Answer 1

Я бы порекомендовал попробовать библиотеку Raphaël . API был вдохновлен jQuery, поэтому он должен быть вам знаком.

Также имейте в виду, что IE не поддерживает SVG, поэтому решение с поддержкой только SVG не будет переносимым во всех основных браузерах. Raphaël позаботится об этом за вас - он использует VML в IE и SVG в других браузерах. Он работает на Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ и Internet Explorer 6.0+.

Вы можете создать SVG с помощью Inkscape, а затем импортировать пути в ваш Raphaël-код. См. доклад Дмитрия Барановского на ЗАО «На 2010».

Answer 2

Я согласен с последним ответом. Перетащите SVG в конвертер на

http://irunmywebsite.com/raphael/svgsource.php

Это поместит ваш SVG в html4 и будет работать во всех браузерах, кроме Android. Вы можете оживить пути с Рафаэлем.

Все выходные данные преобразователя: Raphael / SVG / VML