如何在 Internet Explorer 中针对非 SVG 元素模拟'pointer-events: none”？

在 Internet Explorer 中模拟 point-events:none

Internet Explorer 在使用 point-events:none CSS 属性允许时会带来挑战用户与分层元素的交互。此属性用于忽略特定元素的鼠标事件，仅 IE 可以识别 SVG 元素。

克服限制

尽管有此限制，IE 确实提供了一个替代解决方案。通过将现有元素包装在 SVG 元素中，您可以保留所需的功能。 jQuery 的 wrap 方法可以简化此过程。

示例

假设您希望使用 PNG 渐变覆盖图表并保留图表交互性。您可以使用以下代码来实现此操作：

**CSS:**

#tryToClickMe {
  pointer-events: none;
  width: 400px;
  height: 400px;
  background-color: red;
}

**HTML:**

<svg>

访问上方和下方的对象

如果您需要与 SVG 覆盖层下方的元素进行交互，请考虑使用IE 中的 document.msElementsFromPoint 方法。此方法提供指定点上所有图层的数组。

结论

虽然 IE 中不原生支持pointer-events:none，但使用 SVG 元素和document.msElementsFromPoint 方法提供了一个全面的解决方案，使用户能够与图表交互并维护增强的设计。

以上是如何在 Internet Explorer 中针对非 SVG 元素模拟'pointer-events: none”？的详细内容。更多信息请关注PHP中文网其他相关文章！