svg：激活/關閉動畫

簡短的問題：有沒有一種方法來激活/停用SVG <動畫>元素，以便在給定時間只有一個適用於給定的圖形對象？svg：激活/關閉動畫

我有一個內嵌在一個html文檔中的svg文檔（<svg> </svg >）。在svg中有一個圖形對象，例如一個圓和兩個<動畫效果>當鼠標懸停在圓上時定義的元素。這兩個動畫是無關的，他們爲同一個圓圈實現不同的動畫，在給定時間只有一個<動畫>應該是活動的。我想切換兩個<動畫>元素，所以我需要停用當前活動的<動畫>並激活其他。我怎樣才能做到這一點？

來源

2014-09-03 torel

設置/清除begin屬性，以便動畫不會啓動。 – 2014-09-04 06:13:16

Thx。問題在於，當重新激活時，我需要begin屬性的內容。因此，在清除它之前，我需要將它存儲在變量中，這將是一個痛苦。那是因爲上面的問題只是手頭問題的一個簡化版本，實際上我有大約50個帶有4-8個動畫元素的動畫對象（這是帶有各種動畫的社區的地圖）。某些我將動畫元素收集到一個組或另一個單獨的svg中，並且一次激活/停用整個組或svg會很好。 – torel 2014-09-04 07:20:50

你可以組織你的動畫是這樣的：

<circle id="c1" .../> 
<animate xlink:href="#c1"/> 
<animate xlink:href="#c2"/>

如果從C1更改圓的ID C2那麼第二個動畫將適用，而不是第一個。

來源

2014-09-04 09:21:41

是的，似乎是一個可行的解決方法...希望它不會是一個問題，指向不存在的東西！謝謝！ – torel 2014-09-04 10:00:29

我點擊它，這是你的意思？ – torel 2014-09-04 11:56:31

就是這樣。謝謝。 – 2014-09-04 12:55:12

svg：激活/關閉動畫

回答

相關問題