Click on absolute DIV in Windows mobile firing click on underlying elements

Question

I have a overlay DIV with absolute position width height and width 100%. But when I click on the overlay DIV, click is happening on underlying elements of overlay DIV. Overlay DIV style is like below

 .overlayDIV{
     absolute : absolute;
     height : 100%;
     width : 100%;  
     z-index : 1234;       
 }

How can I prevent that...? This problem exists only in Windows mobile

Answer 1

You can stop the propagation of the event:

JavaScript:

document.getElementById('divId').onclick = function (event) {
    event.preventDefault();
    event.stopPropagation();
}

jQuery:

$('#divId').click(function (event) {
    event.preventDefault();
    event.stopPropagation();
});

Also if you have some handlers on mousedown down the page you need to cancel mousedown from your overlay div (same code but for mousedown handler).