在屏幕上连续动画SVG

时间:2016-07-27 03:42:55

标签: javascript jquery css svg velocity.js

我正在尝试动画一个SVG对象来连续浏览屏幕:

http://jsfiddle.net/PPVda/

然而,我无法让它发挥作用。我的猜测是因为SVG无法使用CSS .animate。

所以我尝试使用velocity.js。

我已经设法使用以下方式重新定位我的svg:

$.Velocity.hook($("#39aa995f-2ba5-4316-9c79-ef5b3d58d63d")[0], "translateX", "-300px");

使用以下方式进行翻译:

$("#39aa995f-2ba5-4316-9c79-ef5b3d58d63d").velocity({
    translateX: 4000,
  }, 9000);

为了使它成为一个连续的,我使用了这个:

setTimeout(test(), 9000)

但是,它不会连续运行。

任何帮助都会很棒!谢谢。

1 个答案:

答案 0 :(得分:1)

请改为尝试:

./main < lines.txt

https://davidwalsh.name/svg-animation

我不建议使用回调来循环使用SVG&#39>