文章詳情頁
html5 - svg如何做到一組動畫循環
瀏覽:126日期: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. android - Genymotion 微信閃退 not find plugin.location_google.GoogleProxyUI2. mac里的docker如何命令行開啟呢?3. android webview返回自動刷新4. docker綁定了nginx端口 外部訪問不到5. angular.js - 關于ng-model和ng-bind的疑問6. html5 - 微信瀏覽器視頻播放失敗7. html - 特殊樣式按鈕 點擊按下去要有凹下和彈起的效果8. javascript - 單個控件多個字段搜索9. objective-c - iOS開發使用什么對html進行代碼高亮10. javascript - npm安裝報錯 系統w7 求大神解答
排行榜
