在拉斐尔撤消前线？

Question

我希望一个元素只在悬停时出现在前面，然后返回到鼠标关闭之前的z-index。拉斐尔有没有办法让我这样做;在调用toFront之前保存元素的当前z-index，然后再次应用它？

Answer 1

简短的回答是，否。原因是SVG不依赖于z-index属性来确定元素呈现顺序 - 它只是使用它们在SVG文档中出现的顺序（所谓的“画家的顺序” - 从后到前）。为了复制相同的东西，您需要在当前元素之前记录该项目，将目标对象移动到悬停时元素列表的末尾，然后将其移动到其上一个兄弟位置之后的原始位置。凌乱而复杂，没有内置支持。

答案越长，你真的不需要。在大多数情况下，你可以逃脱这个简单的伎俩：

el.hover( function()
    {
        var duplicated_node = this.clone();
        duplicated_node.hover( function() {}, function()
            {
                this.remove();
            } );
        duplicated_node.toFront();
    }, function() {} );

换句话说，你     a）克隆对象;     b）向克隆添加悬停功能，当悬停结束时将其删除;     c）将克隆移到前面。由于它将共享原始位置，因此其悬停事件将立即触发。

这不是一个非常干净的解决方案，但它比重新调整元素以重新创建特定订单更好（更简单，更有效） - 特别是如果你有很多元素。