HTML / CSS: uczynić element DIV „niewidocznym” dla kliknięć?

Z różnych powodów muszę umieścić (głównie) przezroczystość <div>na jakimś tekście. Oznacza to jednak, że tekstu nie można kliknąć (np. W celu kliknięcia linków lub wybrania go). Czy można po prostu uczynić ten element div „niewidocznym” dla kliknięć i innych zdarzeń myszy?

Na przykład element overlaydiv obejmuje tekst, ale chciałbym móc kliknąć / zaznaczyć tekst za pomocą elementu overlaydiv:

<div id="container">
    <p>Some text</p>
    <div id="overlay" style="position: absolute; top: 0;
                             left: 0; width: 100%; height:100%">
        ... some content ...
    </div>
 </div>

Można to zrobić za pomocą CSS pointer-events. Ta właściwość jest obsługiwana w przeglądarkach Firefox 3.6+, Chrome 2+, IE 11+ i Safari 4+. Niestety nie mam wiedzy na temat obejścia tego problemu w różnych przeglądarkach.

#overlay {
  pointer-events: none;
}

Można to zrobić, ponownie uruchamiając wydarzenie po tymczasowym ukryciu nakładki.

Zobacz pierwszą odpowiedź na to pytanie: „Nakładka” HTML, która umożliwia kliknięcie elementów znajdujących się za nią

Możesz to zrobić, ukrywając nakładkę w następujący sposób:

overlay.onclick = function(){
    window.event.srcElement.style.visibility = "hidden";
    var BottomElement = document.elementFromPoint((navigator.appName.substring(0,3) == "Net") ? e.clientX : window.event.x,(navigator.appName.substring(0,3) == "Net") ? e.clientY : window.event.y);
    window.event.srcElement.style.visibility = "visible";
    BottomElement.click();
}

Użyj tego jQuery

$("div").click(function(e){e.preventDefault();});

zamień „div” na identyfikator lub element

Alternatywą dla wyłączenia wszystkich zdarzeń (lub laski) w div jest unbind () wszystkie zdarzenia, które są domyślnie powiązane z tagami

  $('#myDivId').unbind();

lub

  $('#myDivId').unbind("click");