2013-11-28 3 views
0

Я анимация svg-путей с использованием метода strokeDashoffset и strokeDasharray в ff и chrome, который работает и отлично выглядит только в IE, я получаю этот странный эффект.IE9 Странное поведение при анимации SVG

Интернет пример - http://www.vicsmash.com/experiments/svganim/

я тестировал с инлайн и SVG getElementsByTagNameNS не приемлю встраивании независимо от того, какой метод я использую IE делает это то же самое - Это также относится и к setInterval и Requestanimframe анимации - абсолютно никакой разницы.

URL изображения - http://i.stack.imgur.com/aD0EG.png

ответ

1

Если IE не перерисовывать что-то, помните, что вы можете вручную заставить SVG перерисовывать с помощью forceRedraw функции. Я думаю, проблема здесь в том, что вы используете плагин, но, к сожалению, я не могу быть уверен.

Вы можете исправить проблему, создав функцию intervalled, которая перерисовывает SVG в течение продолжительности анимации (надеюсь, плагин позволяет событиям onStart/onEnd настраивать и очищать интервал), но для цели " это даже работает», вот скрипка с помощью JQuery: http://jsfiddle.net/eithe/qseGX/

(я нуждался в JQuery только для document.ready события и траверсы узлов, вы можете безопасно удалить его в коде)

+0

Я добавил сила перерисовывать на SVGSVGElenment за кадр, и он по-прежнему делает то же самое. Я не думаю, что это проблема библиотеки, поскольку я пробовал то же самое с requestanimframe и интервалами только в чистом js, это не работает. Даже пример jsfiddle, похоже, ломается. – VicJ

+0

Хорошо перерисовать по существу было ответом, но это нужно было сделать на теле - так что в моем onUpdate, который запускает каждый кадр, я добавил: var n = document.createTextNode (''); document.body.appendChild (n); document.body.removeChild (n); Это, похоже, исправить IE-выпуск - я выгружу пример за секунду, чтобы он был доступен для будущего :) – VicJ

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