SVGストロークダッシュオフセットがサファリで動作しない

Question

-webkit-プレフィックスを追加しても、ストロークダッシュオフセットはサファリでは機能しません。私を助けてください。ありがとう！....

ここに私のサンプルコードです....

#path1 { 
    stroke-dasharray: 500; 
    -webkit-animation: dash 2s ease; 
    animation: dash 2s ease; 
    display:inline-block; 
} 
.path2 { 
    stroke-dasharray: 500; 
    -webkit-animation: dash 2s ease; 
    animation: dash 2s ease; 
    display:inline-block; 
} 

@keyframes dash { 
    from { 
    stroke-dashoffset: -500; 
    } 
} 

@-webkit-keyframes dash { 
    from { 
    stroke-dashoffset: -500; 
    } 
} 

Answer 1

Safariは負のストロークdashoffsetをサポートしていません......

Answer 2

上記のように、負の値ドンストロークダッシュオフセットのための仕事。値を正の数値にシフトすると、これは機能します（初期値もシフトする必要があります）。

.path2 { 
    stroke-dasharray: 1500; 
} 

@keyframes dash { 
    from { 
    stroke-dashoffset: 500; 
    } 
} 

@-webkit-keyframes dash { 
    from { 
    stroke-dashoffset: 500; 
    } 
}