文章詳情頁
html5 - svg如何做到一組動畫循環
瀏覽：82日期：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. node.js - webpack-dev-server正常運行，webpack打包卻出錯，怎么辦？2. android - 哪位大神知道java后臺的api接口的對象傳到前端后輸入日期報錯，是什么情況？求大神指點3. 微信內網頁上傳圖片問題4. mysql - 瞬間流量很高的網站，要頻繁的插入數據到數據庫，應該怎么解決這個問題？5. python - angular route 與 django urls 沖突怎么解決？6. javascript - 關于行內元素onclick事件，為什么會出錯?7. javascript - 關于vuejs的v-for循環問題8. 輸入地址報以下截圖錯誤，怎么辦？9. javascript - 關于iscroll的一段代碼，希望有人解釋10. 非root安裝MySQL5.6報錯，求助！！！
排行榜
網公網安備