我正在使用 Snap.svg 使我的 SVG 元素具有交互性。
我如何移动 Element.group 一组形状在我所有其他形状的“前面”？此操作将在悬停时发生。
这里是一个简单的 JSFiddle 示例：
http://jsfiddle.net/offmilk/b0av7jx6/
我正试图让后面的两个圆圈在悬停时移到前面。
我知道 Raphaël 对 Element.toFront() 形式的单个元素具有类似的功能。两者的创建者都回答了类似的问题here，但我无法将他的解决方案添加到我的hover 设置中。
提前感谢您的帮助！
【问题讨论】：
标签： javascript html svg raphael snap.svg
我认为这取决于您是否介意更改实际的 SVG，或者您是否需要 SVG 保持原样（在这种情况下您将需要 CSS）。
正如您提到的 toFront()，我假设可以更改 SVG。
在这种情况下，您需要做的就是再次将元素附加到 paper/svg 中，它会移到最前面。
所以你可以写 s.append（元素） 要么 this.paper.append（元素） 如果您希望这是一个适用于任何论文的函数。
在本例中，我将使用可重复使用的悬停功能编写如下...
function hoverOverFront() {
this.paper.append( this );
this.attr({ fill: 'green' });
}
function hoverOut() {
this.attr({ fill: 'black' });
};
back.hover( hoverOverFront, hoverOut );
front.hover( hoverOverFront, hoverOut );
【讨论】：