文章詳情頁
html5 - svg如何做到一組動畫循環
瀏覽:120日期: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. redis與mysql一致性問題2. macos - mac下docker如何設置代理3. 我在centos容器里安裝docker,也就是在容器里安裝容器,報錯了?4. css - 求推薦適用于vue2的框架 像bootstrap這種類型的5. mysql關聯更新不成功6. android - coordinatorLayout嵌套recyclerview7. javascript - Web微信聊天輸入框解決方案8. javascript - 微信支付:H5調起支付API,直接說支付失敗9. 想練支付寶對接和微信支付對接開發(Java),好像個人不可以,怎么弄個企業的10. javascript - [多圖預警]reactjs點擊某表格編輯內容,跳轉傳值this.context.router.params.id時id報錯未定義
排行榜
