如何在svg对象的顶部保留html控件交互？

Question

我有一个SVG画布，可以让我在我的网页表单上渲染工具，比如量角器。 如果我在操作z-index属性的表单上呈现SVG画布我无法访问我的表单控件，如果我在表单后面渲染SVG，一旦它从可见区域消失，我就无法访问我的SVG对象。以下是图片：

希望问题得到充分描述，如果SVG对象正好位于控件之上，理想的解决方案是阻止表单控件。

任何帮助表示感谢。

P.S。刚刚发现该页面在IE 10上的表现符合要求？！

Answer 1

如果您不需要SVG进行任何交互（点击，鼠标悬停），那么只需为您的svg容器添加此CSS规则：

#your-svg-container-id {
 pointer-events: none;
}

对于鼠标指针，SVG将变得“透明”，您可以放心地将其放在表单上。