2011-12-27 67 views
4

我正在開發一個使用html和javascript.I的移動web應用程序,我有一個任務來開發這個應用程序中的加載覆蓋,我已經做了一個透明的div作爲覆蓋,而它需要防止點擊下面的元素透明div.But只有在Windows手機(IE瀏覽器),我可以點擊底層的元素。我可以如何防止這種情況?的CSS下面給出我已經申請了它如何防止點擊windows phone下透明覆蓋div下的元素?

.overlaypage { 
top: 0px; 
opacity: .5; 
background: black; 
position: absolute; 
height: 100%; 
width: 100%; 
pointer-events: visible; 
display: block; 
z-index: 1001; 
} 
+0

我有同樣的問題。任何解決方案 – Frank 2016-02-13 12:11:24

回答

2

添加的onclick attribure到overlaypage塊。像:

<div class="overlaypage" onclick="return false;"></div> 
+0

-1:不好的做法,甚至沒有解決問題 – 2013-03-20 14:00:23

+2

不好的練習部分是可以討論的 - 但它確實有效。該事件返回false - 並阻止傳播,這會停止下面的項目上的click事件(通過z-index,上面的html樹結構) – Kristijan 2014-01-07 08:40:17

2

我在這裏找到這個問題的第一次,但我發現了另一個SO職位,不得不爲我here工作僅CSS的解決方案。

的CSS的要點如下:

.overlay { 
    height: 0px; 
    overflow: visible; 
    pointer-events: none; 
    background:none !important; 
} 

就我而言,我有文字還有,我不希望用戶能夠選擇它,所以增加了以下(見用戶選擇herehere):

.overlay { 
    -webkit-user-select: none; /* Chrome all/Safari all */ 
    -moz-user-select: none;  /* Firefox all */ 
    -ms-user-select: none;  /* IE 10+ */ 
    user-select: none;   /* Likely future */  
}