如何使具有高 z-index 的元素允许在下面的元素处发生点击事件？
How to make elements with high z-index allow click events at elements below?
我正在开发 chrome 扩展。它基本上是一个位于可见屏幕上部的工具栏，作为 Iframe 添加到页面。
我的问题是我将它设置得很高 z-index 以确保显示栏；然后它下面的元素（在 Iframe 下面）变得不可点击（假设我得到了一块透明的 iFrame，允许用户看到它下面的元素）。其他 Stack Overflow 问题没有解决我的问题，因为他们认为我可以控制上部和下部元素，而我没有控制下部元素。
您只需使用 CSS
即可完成此操作
pointer-events: none
height: 0px;
overflow: visible;
如果只有 iframe 的某些部分应该让点击通过，那么在 iframe 的 onclick 处理程序中通过 postMessage with the click point coordinates and in the content script's document.addEventListener for that message use querySelectorAll(':hover') or document.elementFromPoint while temporarily hiding the iframe to find the clicked element and then dispatch a new click event to that element via dispatchEvent 向页面的内容脚本发送消息（加上 iframe 的左上角偏移量原始文档）。
我正在开发 chrome 扩展。它基本上是一个位于可见屏幕上部的工具栏，作为 Iframe 添加到页面。
我的问题是我将它设置得很高 z-index 以确保显示栏；然后它下面的元素（在 Iframe 下面）变得不可点击（假设我得到了一块透明的 iFrame，允许用户看到它下面的元素）。其他 Stack Overflow 问题没有解决我的问题，因为他们认为我可以控制上部和下部元素，而我没有控制下部元素。
您只需使用 CSS
即可完成此操作pointer-events: none
height: 0px;
overflow: visible;
如果只有 iframe 的某些部分应该让点击通过，那么在 iframe 的 onclick 处理程序中通过 postMessage with the click point coordinates and in the content script's document.addEventListener for that message use querySelectorAll(':hover') or document.elementFromPoint while temporarily hiding the iframe to find the clicked element and then dispatch a new click event to that element via dispatchEvent 向页面的内容脚本发送消息（加上 iframe 的左上角偏移量原始文档）。