文章詳情頁
html5 - svg如何做到一組動畫循環
瀏覽:186日期:2023-01-29 15:27:39
問題描述
問題解答
回答1:如果只是單純的改變寬度,少年可以這樣實現
<svg> <rect x=’20’ y=’20’ width=’250’ height=’250’ fill=’blue’><animate animateType='css' attributeName='width' values='250;0;250' dur='3s' repeatCount='indefinite'/> </rect></svg>回答2:
給animate添加id后,使用begin來指定動畫開始的時間為另一個的結束。
不清楚有沒有更好的辦法。
<svg> <rect x='20' y='20' fill='blue'><animate attributeType='CSS' attributeName='width' begin='0s; second.end' from='250' to='0' dur='1s'></animate><animate attributeType='CSS' attributeName='width' begin='first.end' from='0' to='250' dur='1s'></animate> </rect></svg>
標簽:
Html5
相關文章:
1. docker 下面創建的IMAGE 他們的 ID 一樣?這個是怎么回事????2. html5和Flash對抗是什么情況?3. docker 17.03 怎么配置 registry mirror ?4. html5 - datatables 加載不出來數據。5. 運行python程序時出現“應用程序發生異常”的內存錯誤?6. node.js - mongodb查找子對象的名稱為某個值的對象的方法7. 測試自動化html元素選擇器元素ID或DataAttribute [關閉]8. javascript - QQ第三方登錄的問題9. spring-mvc - spring-session-redis HttpSessionListener失效10. javascript - 在 model里定義的 引用表模型時,model為undefined。
排行榜

網公網安備