如何在具有背景的HTML元素下與DOM元素交互？

Question

I need this fiddle solved.

我無法與具有背景的另一個HTML元素下的DOM元素進行交互。這是HTML/CSS 101.但是，通過將背景與rgba和不透明CSS屬性相結合，這並不總是理想的效果。就像我的情況一樣，我需要一個元素的背景來始終處於所有其他元素之上。

說實話，我不知道從哪裏開始解決這種情況。我希望有一個CSS解決方案可以讓事件通過具有背景的元素傳播。我懷疑這存在。

我的另一個想法是使用JavaScript解決方案以某種方式強制捕獲下面元素的事件，就好像上面的元素甚至不存在一樣。

如何在具有背景的HTML元素下與DOM元素交互？

請注意，我需要這個工作在所有現代瀏覽器。

Answer 1

我知道能夠訪問鏈接的一種方法是將#cursor-block div上的指針事件設置爲none。

jsFiddle example

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

注意指針事件不低於IE9工作。