Возникли проблемы при попытке начать работу с jQuery SVG в Firefox

Question

Я пытаюсь поэкспериментировать с SVG на Firefox.Поскольку я использую jQuery, я хотел бы, по крайней мере, попробовать jQuery SVG.В настоящее время я использую Firefox 3.6.12 в Windows 7 Home Premium.

Когда я получаю доступ к http://keith -wood.name / svgBasics.html , демо-версия отлично работает для меня.Однако, когда я загружаю, нажимая кнопку «Загрузить сейчас» на http://keith -wood.name / svg.html , извлекаю ZIP-файл в папку на своем компьютере и пытаюсь запустить ту же демонстрациюкажется, что ни один из SVG ничего не делает (включая начальную часть, которая должна выполняться без взаимодействия с пользователем).

Согласно Firefox, сервер обслуживает страницу как MIME-тип 'text / html' (нет, например 'text / svg + html), так что это не то, что отличается.

Любые идеи приветствуются;конечно, я больше всего хотел бы услышать от любого, кто испытал то же самое и нашел обходной путь.

(Для всех, кого это волнует, я еще не решил, буду ли я в конечном итоге использовать jQuery SVG или Raphaelили даже действительно ли я буду использовать SVG или HTML5 canvas, но я бы хотел взять их всех в руки, прежде чем принимать решения.)

Answer 1

В скачанном коде есть ошибки.Если вы откроете svgBasics.html из zip-файла, вы увидите:

<style type="text/css">
@import "css/jquery.svg.css";

#svgbasics { width: 400px; height: 300px; border: 1px solid #484; }
</style>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/jquery.svg.js"></script>

В zip-архиве нет каталогов css или js.Во-вторых, jQuery не входит.Если вы замените приведенные выше строки в svgBasics.html этим, пример сработает.(Проверено в FF4b6 и Chrome9.)

<style type="text/css">
@import "jquery.svg.css";

#svgbasics { width: 400px; height: 300px; border: 1px solid #484; }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.svg.js"></script>