在拉斐爾撤消toFront？

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() {}); 

換句話說，你 一）克隆對象; b）將懸停功能添加到克隆，當懸停結束時將其移除; c）將克隆移到前面。由於它將共享原始位置，因此其懸停事件將立即觸發。

這不是一個完全乾淨的解決方案，但它比嘗試重新組合您的元素以重新創建特定順序更好（更簡單，更高效） - 尤其是當您有很多元素時。