2

このフィドルを解決する必要があります。

背景のある別のHTML要素の下にあるDOM要素を操作できません。これはHTML/CSS 101です。ただし、背景をrgbaおよび不透明度CSSプロパティと組み合わせた場合、これが常に望ましい効果になるとは限りません。私の場合のように、要素の背景が常に他のすべての要素の上にある必要があります。

正直なところ、この状況をどこから解決し始めればよいのかわかりません。背景のある要素を介したイベントの伝播を可能にするCSSソリューションがあることを望んでいます。私はそれが存在するのではないかと疑っています。

私の他の考えは、JavaScriptソリューションを使用して、下の要素へのイベントのキャプチャを強制して、上の要素が存在しないかのように動作させることです。

背景のあるHTML要素の下でDOM要素を操作するにはどうすればよいですか？

最近のすべてのブラウザで機能するには、これが必要になることに注意してください。

4

1 に答える 1

6

リンクにアクセスできることを私が知っている1つの方法は、#cursor-blockdivでpointer-eventsをnoneに設定することです。

jsFiddleの例

#cursor-block {
    background: rgba(0, 0, 0, .075);
    position: absolute;
    top: 0;
    bottom: 0;
    width: 15px;
    z-index: 2;
    pointer-events: none;
}

IE9より下では、ポインタイベントは機能しないことに注意してください。

于 2012-09-28T17:06:16.647 に答える