Javascript 在悬停状态下移除clipPath

简言之，我有一个图像是用

clipPath

屏蔽的，这样它就可以在IE9+中工作。问题是我需要将遮罩隐藏在悬停状态，以便它显示完整的图像，然后在鼠标上重新应用。我现在的脚本不起作用。钢笔包括在下面。我对SVG和

clipPath

非常陌生

$（文档）.ready（函数（）{
$（“.finish”）
.mouseover（函数（）{
$（this）.find（'svg'）.find（'clipPath'）.css（'display'，'none'）；
}).mouseout（函数（）{
$（this）.find（'svg'）.find（'clipPath'）.css（'display'，'block'）；
});
})

测试图像
测试123

更改

clipPath

元素本身的

display

属性无效，因为

clipPath

只是一个定义，它本身没有任何显示。被定义的

clipPath

剪辑后显示的是

图像。因此，一个简单的解决方案是只需在mouse-in中删除
clip-path
属性，然后在mouse-out中再次添加它（连同原始clip-path URL）


$（文档）.ready（函数（）{
$（'.finish'）.mouseover（函数（）{
$（this.find（'svg image'）.removeAttr（'clip-path'）；
}).mouseout（函数（）{
$（this.find（'svg image'）.attr（'clip-path'，'url（#maskID0'）；
});
})

测试图像
测试123
为什么不删除鼠标上方的
剪辑路径
属性，并在鼠标移出时重新应用它？类似这样的事情$（function（）{$（this.find（'svg'）.removeAttr（“剪辑路径”）；}）；类似于（我修改了剪辑路径的宽度，但你明白了）。“那有帮助吗？”哈利只是想让我明白你在做什么。悬停时，您正在将剪辑路径设置为在MousCenter上没有url，然后将原始url添加回mouseout正确吗？是否可以将其添加为答案，以便我可以为您接受？