运行 ❯
获取您
自己的
网站
×
更改方向
保存代码
更改主题，深色/浅色
前往 Spaces
<!DOCTYPE html> <html> <body> <h2>Rotating ellipses</h2> <svg width="100%" height="300" xmlns="http://www.w3.org/2000/svg"> <g id="R1" transform="translate(250 250)"> <ellipse rx="100" ry="0" opacity=".3"> <animateTransform attributeName="transform" type="rotate" dur="7s" from="0" to="360" repeatCount="indefinite" /> <animate attributeName="cx" dur="8s" values="-20; 220; -20" repeatCount="indefinite" /> <animate attributeName="ry" dur="3s" values="10; 60; 10" repeatCount="indefinite" /> </ellipse> </g> <use href="#R1" transform="rotate(72 390 150)" /> <use href="#R1" transform="rotate(144 390 150)" /> <use href="#R1" transform="rotate(216 390 150)" /> <use href="#R1" transform="rotate(288 390 150)" /> </svg> <p><strong>Note:</strong> This example does not work in Firefox.</p> </body> </html>
