ホームページ >ウェブフロントエンド >CSSチュートリアル >Internet Explorer で「pointer-events: none」をエミュレートする方法

Internet Explorer で「pointer-events: none」をエミュレートする方法

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-11-16 08:10:03874ブラウズ

How to Emulate `pointer-events: none` in Internet Explorer?

ポインター イベントのエミュレート: Internet Explorer ではなし

ハイチャートの拡張に関わるプロジェクトで、グラデーション PNG を表示する必要が生じました。チャート上で。 CSS プロパティの pointer-events: none を使用すると、div がオーバーレイされているにもかかわらず、ユーザーがチャートを操作できるようになります。ただし、このプロパティは Internet Explorer では認識されません。

IE でポインター イベントのような機能を有効にする方法?

while pointer-events: none は直接ではありません。 Internet Explorer ではサポートされていますが、ブラウザは、W3C で指定されている SVG 要素のポインター イベントをサポートしています。これは、SVG 要素を使用して同様の機能を実現できることを意味します。

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

このアプローチでは、マウス イベントが SVG 要素を介して基礎となる要素に渡されます。 jQuery の Wrap() メソッドを使用して SVG 内で既存の要素をラップすることで、この機能をさらに強化できます。

上層オブジェクトと下層オブジェクトにアクセスするための代替ソリューション

必要な場合上層オブジェクトと下層オブジェクトの両方にアクセスするには、IE で使用できる document.msElementsFromPoint メソッドを利用できます。このメソッドは、指定されたポイント上のすべてのレイヤーの配列を返し、アクセス可能な両方の要素を操作できるようにします。

以上がInternet Explorer で「pointer-events: none」をエミュレートする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。