将路径svg动画转换为纯css动画

时间:2017-03-29 06:31:39

标签: animation svg

是否可以将此路径动画转换为纯css动画?

<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewPort="0 0 595.28 841.89">
  <g>
    <path id="thread" transform="translate(242, 130)" fill="none" stroke="#fff" d="M 302 540 l 1 -150">
      <animate attributeType="XML" attributeName="d" values="M-108 -30 c0 10 -10 90 0 106;
                     M-108 -30 c0 10 3 90 0 106;
                     M-108 -30 c0 10 10 90 0 106;
                     M-108 -30 c0 10 -3 90 0 106;
                     M-108 -30 c0 10 -10 90 0 106" keyTimes="0; 0.25; 0.5; 0.75; 1" dur="5s" repeatCount="indefinite" />
    </path>
  </g>
</svg>

0 个答案:

没有答案
相关问题