Overlay Div可以點擊通過

Question

我想知道是否有一種方法使用CSS或JavaScript，允許一個半透明的div元素可視化地出現在所有其他元素的頂部，但超鏈接和其下的其他交互元素可以仍然被點擊？只是一個異想天開的想法，讓我的網站能夠變暗或減輕網站的外觀。

編輯

我知道的z-index從背景中的物體移動到前臺，但他們也阻止物體互動......

Answer 1

通過 poiner-events:none

這種行爲可能（非標和不支持IE ）。 本來是一個SVG的功能，它支持任何SVG元素（IE 9）：

<svg poiner-events="none"> 
    <rect width="100%" height="100%" fill="black" fill-opacity="0.5" /> 
</svg> 

但對於影響你提到我會建議使用在body不透明和一些背景上html：

body { 
    opacity: 0.5; 
} 

html { 
    background: black; 
} 

Answer 2

在現有的div上創建另一個div元素，並且它的z-index比現有的更多。希望這應該有所幫助。