jquery - 移动 HTML5 SVG 路径

Question

我的应用程序中有一个 SVG 路径元素，例如：

<path d="M100,100 Q200,400,300,100"/>

在按钮单击中，我必须将此路径向左移动，例如，从 100 到 200。我通过变换做到了：

$('.path').each(function () {
    $(this).attr('transform', 'translate(100, 0)');
});

但是，在下一次单击时它不会移动。如何让路径元素在每次点击时移动？

score 6 · Accepted Answer

翻译将尝试再次做同样的事情。您需要将值存储在变量中并使用它：

var x=0;
$('.path').each(function () {
   x += 100;
   $(this).attr('transform', 'translate('+x+', 0)');
});

这个例子表明你可以在每次点击时将它向右移动 100，所以锻炼你想要应用到 x 的东西，你应该会笑。

1 回答 1