2014-09-13 2 views
1

Я использую svg.js (Website) для анимации многоугольника внутри маски. Это отлично работает в Chrome и IE. Однако, если я попробую в Firefox, анимация будет нарушена.Нечеткое поведение svg.js "animate(). Move()" в Firefox

Пожалуйста, взгляните на это jsfiddle.

HTML:

<div id="drawing"></div> 

JS:

var draw = SVG('drawing'); 
var rect = draw.rect(1000, 300).fill({ color: '#fff' }); 
var polygon = draw.polygon('100,260 50,300 150,300').fill('#000'); 
var mask = draw.mask().add(rect).add(polygon); 

var bgrect = draw.rect(1000, 300).fill({ color: '#ff0000' }); 
bgrect.maskWith(mask); 
polygon.animate().move(500,260); 

В Chrome и IE треугольник движется 500px вдоль оси х, которая является то, что я хочу. Однако в Firefox он перескакивает в верхний левый угол и анимирует вниз в исходное положение.

Есть ли способ сделать анимацию в Firefox тоже? Я тестирую в FF 32.0.1 кстати.

ответ

0

Эта ошибка исправлена ​​в последнем фиксации (https://github.com/wout/svg.js/commit/8617a6b5d5ff147718051a7fc582c54f603aa90f).

Firefox не вычисляет ограничительную рамку скрытых элементов. Поскольку все в defs скрыто по определению, Firefox терпит неудачу, когда дело доходит до вычисления bbox. Однако это было проработано в названной фиксации.

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

  • Нет связанных вопросов^_^