準備做一個動畫
Re: 準備做一個動畫
代码： 全选
<svg id="etani" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" width="480" height="480" rfm="repeat"> <defs mode="0" rotatestep="0" rotatestart="0" stepvalue="60" snapto="0" displaywait="1"> <g id="tile0" frontfill="#ca5326" backfill="#2691c0"><path fill="none" stroke="none" d="M 12,12 L -11,11 L -10,-10 L 9,-9 Z"/>
<circle opacity="0.7" fill="lightblue" cy="0" cx="0" r="12" stroke="none">
<animate attributeName="r" repeatCount="indefinite" dur="4s" values="62.354;62.354;33.415;33.415;62.354"/>
</circle>
</g><g id="tile1" fill="none" stroke="none" frontfill="#ca5326" backfill="#2691c0"><path d="M 12,12 L -11,11 L -10,-10 L 9,-9 Z"/>
<circle opacity="0.7" fill="lightblue" cy="0" cx="0" r="12" stroke="none">
<animate attributeName="r" repeatCount="indefinite" dur="4s" values="33.415;33.415;62.354;62.354;33.415"/>
</circle>
</g></defs> <g class="etdrop" transform="translate(48,48) scale(0.8)" stroke="#777" stroke-width="2" stroke-linejoin="round" id="etanidrop"><g class="etboard">
</g><use href="#tile0" fill="#ca5326" transform="translate(240,52.939) scale(1,1) rotate(0)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(132,52.939) scale(1,1) rotate(0)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(348,52.939) scale(1,1) rotate(0)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(78,146.469) scale(1,1) rotate(0)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(186,146.469) scale(1,1) rotate(0)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(294,146.469) scale(1,1) rotate(0)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(402,146.469) scale(1,1) rotate(-151.318)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(348,240) scale(1,1) rotate(-151.318)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(456,240) scale(1,1) rotate(-151.318)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(132,240) scale(1,1) rotate(-151.318)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(186,333.531) scale(1,1) rotate(-151.318)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(294,333.531) scale(1,1) rotate(123.038)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(24,240) scale(1,1) rotate(-12.203)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(78,333.531) scale(1,1) rotate(-12.203)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(132,427.061) scale(1,1) rotate(-12.203)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(402,333.531) scale(1,1) rotate(-12.203)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(348,427.061) scale(1,1) rotate(-12.203)" class="tiledropped"/><use href="#tile0" fill="#ca5326" transform="translate(240,427.061) scale(1,1) rotate(-12.203)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(240,132) scale(1,1) rotate(36.179)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(240,24) scale(1,1) rotate(4.394)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(146.469,78) scale(1,1) rotate(4.394)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(333.531,78) scale(1,1) rotate(-68.94)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(427.061,132) scale(1,1) rotate(-68.94)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(333.531,186) scale(1,1) rotate(-68.94)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(146.469,186) scale(1,1) rotate(-68.94)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(52.939,132) scale(1,1) rotate(-68.94)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(52.939,240) scale(1,1) rotate(-68.94)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(52.939,348) scale(1,1) rotate(-102.52)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(146.469,294) scale(1,1) rotate(-102.52)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(146.469,402) scale(1,1) rotate(-102.52)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(240,348) scale(1,1) rotate(-102.52)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(240,456) scale(1,1) rotate(-117.436)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(333.531,402) scale(1,1) rotate(-117.436)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(427.061,348) scale(1,1) rotate(-117.436)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(333.531,294) scale(1,1) rotate(-117.436)" class="tiledropped"/><use href="#tile1" fill="#ca5326" transform="translate(427.061,240) scale(1,1) rotate(-117.436)" class="tiledropped"/></g></svg>
暫時先做成這樣。需要重新再做一個。
上次由 ejsoon 在 2025年 12月 7日 09:45，总共编辑 1 次。
https://ejsoon.vip/
弈趣極光：享受思維樂趣
弈趣極光：享受思維樂趣
在线用户
正浏览此版面之用户： Google [Bot] 和 0 访客