要素をクリックできないようにする（その背後にあるものをクリックする）

ユーザーがタッチスクリーン（モバイル）をスクロールしているときにページをオーバーレイする固定画像があります。

その画像を「クリック不可」または「非アクティブ」などにしたいので、ユーザーがその画像をタッチしてドラッグした場合でも、画像がないかのようにその後ろのページがスクロールして、インタラクションが「ブロック」されます。

これは可能ですか？必要に応じて、私が言っていることを例示するスクリーンショットを提供することを試みることができます。

ありがとう！

CSSの設定- pointer-events: none画像とのマウスの相互作用を削除する必要があります。IE以外のすべてでかなりうまくサポートされています。

これpointer-eventsが取ることができる値の完全なリストです。

CSSポインターイベントはあなたが見たいものです。あなたの場合、pointer-eventsを "none"に設定してください。例については、このJSFiddleを見てください... http：//jsfiddle.net/dppJw/1/

アイコンをダブルクリックしても、段落をクリックしたと表示されることに注意してください。

div.child {
    ...    
    background: #fff;
    pointer-events: none //This line is the key!
} 

JavaScriptを使用したい場合：

document.getElementById("x").style.pointerEvents = "none";

<a href="https://www.google.com" id="x" />Unclickable Google Link</a>
<br>
<a href="https://www.google.com" id="" />Clickable Google Link</a>