SVG가 아닌 요소에 대해 Internet Explorer에서 `pointer-events: none`을 어떻게 에뮬레이트할 수 있나요?

Internet Explorer에서 포인터 이벤트:없음 에뮬레이션

Internet Explorer에서는 포인터 이벤트:없음 CSS 속성을 사용할 때 문제가 발생합니다. 계층화된 요소와의 사용자 상호 작용. 특정 요소에 대한 마우스 이벤트를 무시하는 데 사용되는 이 속성은 IE에서 SVG 요소에 대해서만 인식됩니다.

제한 극복

이러한 제한에도 불구하고 IE는 대체 솔루션. 기존 요소를 SVG 요소로 래핑하면 원하는 기능을 유지할 수 있습니다. jQuery의 래핑 방법을 사용하면 이 프로세스를 단순화할 수 있습니다.

예

차트를 PNG 그라디언트로 덮고 차트 상호 작용을 유지하려고 한다고 가정해 보겠습니다. 다음 코드를 사용하여 이를 구현할 수 있습니다.

**CSS:**

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

**HTML:**

<svg>

상위 및 기본 객체 액세스

SVG 오버레이 아래의 요소와 상호 작용해야 하는 경우 IE의 document.msElementsFromPoint 메서드. 이 방법은 지정된 지점에 있는 모든 레이어의 배열을 제공합니다.

결론

pointer-events:none은 IE에서 기본적으로 지원되지 않지만 SVG 요소와 document.msElementsFromPoint 메서드는 사용자가 차트와 상호 작용하고 향상된 디자인을 유지할 수 있도록 하는 포괄적인 솔루션을 제공합니다.

위 내용은 SVG가 아닌 요소에 대해 Internet Explorer에서 `pointer-events: none`을 어떻게 에뮬레이트할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!