【HTML5】SVG小球碰撞

来源:互联网 发布:湖南软件职业学院吧 编辑:程序博客网 时间:2024/06/05 07:24

效果截图:



代码:

<!DOCTYPE html><html>  <head>    <title>SVG SMIL Animate with Path</title>  </head>  <body>    <svg xmlns="http://www.w3.org/2000/svg" width="300px" height="100px">      <rect x="0" y="0" width="300" height="100" stroke="black" stroke-width="1" />        <circle cx="0" cy="50" r="15" fill="blue" stroke="black" stroke-width="1">          <animateMotion path="M 0 0 H 300 Z" dur="3s" repeatCount="indefinite" />        </circle>      </svg>  </body></html>



0 0