有沒有辦法檢測到z-index較低的圖像是否存在？

我們的網站有一個典型的多級下拉菜單。所以它在一個高Z指數的固定DIV上。（例如WordPress的管理員，每個鏈接的文本顏色都是黑色的，透明背景。）問題是，在某些頁面上，這些菜單項難以閱讀，因爲可能存在一個圖像，因此透明背景會使文本模糊。有沒有辦法檢測到z-index較低的圖像是否存在？

有沒有辦法讓菜單項檢測到在相同位置的較低Z索引處有圖像（或具有類似深色的div）？這樣，我可以使用JS或jQuery來爲這些特定頁面上的菜單項設置有條件的樣式。

在CSS中有混合混合模式屬性，它不適用於圖像，但這是我正在尋找的---一種方法來檢測底層的顏色和調整文本的顏色因此它總是清晰的。

2016-06-15 jchwebdev

是的，它可以做到，但不是一個快速的班輪來回答這個問題。使用背景 – charlietfl

不是一個選項。整個主題是基於透明的外觀。 – jchwebdev

菜單打開時如何掩蓋圖像？會更簡單 – charlietfl

只使用的JavaScript，你可以從這裏開始：因爲你想一次FINT多個項目的z-index的Getting the z-index of a DIV in JavaScript?

，如果你使用jQuery的看到這裏會更容易：https://api.jqueryui.com/zIndex/

使用jQuery您可以選擇落在由下圖中邊界框定義的屏幕的某個區域內的元素，並獲得更大的Z-index值並向其中添加一個類，以刪除透明質量。

正如@charlietfl在評論中指出的那樣，對於可以更簡單地完成的事情來說，這是一項很多工作。

2016-06-15 23:41:49 grateful

（嘆氣）好。我認爲jQuery在桌面上。我會將其添加到我的問題。無論如何，我需要的是能夠檢測較低z索引上的像素的顏色 - 如果它較暗或較暗。這種事情必須有插件或算法。畢竟在CSS中有混合混合模式......它只是對圖像不起作用。 – jchwebdev

這可能對您有用 - https://www.sitepoint.com/javascript-generate-lighter-darker-color/ – grateful

回答