HTML / CSS: Faites un div “invisible” aux clics?

Pour diverses raisons, je dois mettre un

(principalement) transparent sur du texte. Cependant, cela signifie que le texte ne peut pas être cliqué (par exemple, pour cliquer sur des liens ou le sélectionner). Serait-il possible de simplement rendre ce div “invisible” aux clics et autres événements de la souris?

Par exemple, les couvertures div recouvrent le texte, mais je voudrais pouvoir cliquer / sélectionner le texte via la div overlay :

  Some text
Le centre d’alignement HTML ne fonctionne pas?
z-index ne fonctionne pas avec la position absolue
Ajouter un espace entre les cellules (td) en utilisant css
Pourquoi l’activation de l’accélération matérielle dans CSS3 ralentit-elle les performances?
Qu’est-ce que le style de liste par défaut (CSS)?
  ... some content ...

Cela peut être fait en utilisant pointer-events CSS. Cette propriété est prise en charge dans Firefox 3.6+, Chrome 2+, IE 11+ et Safari 4+. Malheureusement, je ne connais pas une solution de contournement entre navigateurs.

 #overlay { pointer-events: none; }

Cela peut être fait en renvoyant l’événement après avoir masqué temporairement la superposition.

Voir la première réponse à cette question: HTML “overlay” qui permet aux clics de passer à travers les éléments

Vous pouvez le faire en cachant la superposition comme ceci:

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

Utilisez cette jQuery

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

remplacer “div” par l’ID ou l’élément

Alternative pour désactiver tous les événements (ou poussins) sur un div est unbind () tous les événements qui sont attachés avec des tags par défaut

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

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