SVG動畫在Chrome中正常工作但在Firefox中不能正常工作

SVG動畫在Chrome中正常工作，但在Firefox中無法正常工作。我想在頁面加載後0.4秒開始動畫。這是密碼SVG動畫在Chrome中正常工作但在Firefox中不能正常工作

<svg width="300px" height="300px" version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events"> 
<circle cx="150" cy="150" r="70"> 
     <animate dur="2s" attributeName="r" begin=".4" restart="whenNotActive" calcMode="spline" values="0; 100; 70; 50; 70; 95; 70; 60; 70; 75; 70; 68; 70" keySplines="0 .75 .5 1; .5 0 1 .25; 0 .25 .25 1; .5 0 1 .5; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1" keyTimes="0; 0.2564; 0.5128; 0.6154; 0.6923; 0.7436; 0.7949; 0.8462; 0.8974; 0.9231; 0.9487; 0.9744; 1" fill="freeze"></animate> 
    </circle> 
</svg>

我在做什麼錯？

來源

2014-06-22 matuag

請說明到底發生了什麼錯，「不正常」是不是爲讀者非常有幫助。 –

它不是在Firefox中動畫。 – matuag

問題是與開始=「。4」在這裏檢查http://jsfiddle.net/aTY4y/ –

你的語法開始是錯誤的。嘗試0.4s而不是.4，它會起作用。語法是here，Firefox可以精確地實現它。我建議你在Chrome上提交一個錯誤，它工作不正確。

這裏是你的測試用例糾正......

<svg width="300px" height="300px" version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events"> 
<circle cx="150" cy="150" r="70"> 
     <animate dur="2s" attributeName="r" begin="0.4s" restart="whenNotActive" calcMode="spline" values="0; 100; 70; 50; 70; 95; 70; 60; 70; 75; 70; 68; 70" keySplines="0 .75 .5 1; .5 0 1 .25; 0 .25 .25 1; .5 0 1 .5; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1" keyTimes="0; 0.2564; 0.5128; 0.6154; 0.6923; 0.7436; 0.7949; 0.8462; 0.8974; 0.9231; 0.9487; 0.9744; 1" fill="freeze"></animate> 
    </circle> 
</svg>

來源

2014-06-22 14:55:56

這解決了我的問題，純粹是我的錯。謝謝你，謝謝你的幫助:) – matuag

SVG動畫在Chrome中正常工作但在Firefox中不能正常工作

回答

相關問題