IE 7，JavaScript透明div onclick

Question

好吧，我有一個透明的div或背景設置為透明:) CSS：

#lowerLayer
{
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    width: 100%;
    height: 100%;
    background-color: Transparent;
    cursor: help;
    z-index: 1;
}

div放置在標簽的正下方。在此之下，我有一個藍圖布局。

jQuery（這在$（document）.ready中運行）：

$("#lowerLayer").click(function() {
    $(this).fadeTo("fast", 0, function() {
        $(this).hide(0);
    });
});

我的布局在Opera 10中工作完美，我猜它在Opera 9中可以工作……但是具有較低z-index的IE 7 bug層在透明div上方起作用。

Answer 1

我對IE7也有同樣的問題，找到了更簡單的解決方案。 而是使用CSS使div透明，而使用javascript設置它的不透明度。

按照您的示例：

CSS風格

#lowerLayer {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-color: #000;
cursor: help;
z-index: 1;
}

javascript代碼（例如，在加載DOM樹之后）

document.getElementById("lowerLayer").style.filter = "alpha(opacity=0)";

Answer 2

一個簡單的解決方案是將透明div（#lowerLayer）放在html的最后（恰好在結束</body> 。

這是某些瀏覽器（例如IE）的已知問題

編輯：正如我的評論中所述，如果要用覆蓋蒙版頁面， blockUI插件可以處理您可能需要的所有內容。