SVG文字动画

Question

我有一个移动应用程序，涉及以选取框方式移动文本。我使用了 css3 动画，它在移动设备上看起来很慢。我选择使用 svg 作为动画。如何在 svg 中实现选取框动画。我是新手。

Answer 1

这是一个带有滚动文本的简单动画。希望这会让你开始。

网上有很多关于如何制作 SVG 动画的教程。如果需要更多信息，也可以阅读 SVG 规范。

请注意，像这样的 SMIL 动画（SMIL 是使用<animate>标签的动画）在 IE 中不起作用。但是如果你需要支持 IE，你可以使用像 FakeSmile 这样的库。

<svg width="500" height="100">
  <text x="0" y="80" font-size="80">Here is some scrolling text
    <animate attributeType="XML" attributeName="x" 
         values="520;-880;520" dur="15s" repeatCount="indefinite"/>
  </text>
</svg>