stroke-dashoffset svg animation

[riki81]

Hi, it seems that there are problems with "stroke-dashoffset, used to animate SVG.

I am using this script combined with jQuery.Keyframes. It's working perfectly on Firefox and Chrome, but with Safari I've got serious problems. Nth is working.

The code from jQuery.Keyframes is: $.keyframe.define({ name: data_name, to: { 'stroke-dashoffset': stroke_dashoffset }, });

The code supposed to be generated is sth like this: @-webkit-keyframes data_name { to { stroke-dashoffset: 200; } }

@keyframes data_name { to { stroke-dashoffset: 200; } }

What's the problem? I've made the same question to guys from jQuery.Keyframes, just to understand where the problem is situated. For my little knows, problem is inside PrefixFree, 'cause jQuery.Keyframes is doing its work correctly.

[pygy]

What Safari version are you using? In v9, stroke-dashoffset is unprefixed, which makes it unlikely that PrefixFree is to blame. Perhaps Safari is bad at this?

[].indexOf.call(getComputedStyle(document.documentElement, null), 'stroke-dashoffset')
// 293
'strokeDashoffset' in getComputedStyle(document.createElementNS('path', 'svg'), null)
// true

Yes, getComputedStyle() returns an array when querying document, but an object when querying SVG elements...