JSFiddle - React, Tailwind, and code Playground
HTML
<div class="clickme">Click me to trigger the mousedown event; will leak a click event on the body in IE</div>
CSS
.clickme {
background-color: #BBB;
}
.overlay {
position: fixed; /* or absolute */
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: #000;
}
JavaScript
$(document).on('click', function(event) {
console.log('body click');
});
$('.clickme').on('mousedown', function(event) {
console.log('div mousedown');
mask = $('<div></div>');
mask.attr('class','overlay');
mask.appendTo('body');
// event.stopPropagation(); // doesn't help
// event.stopImmediatePropagation(); // doesn't help
// event.preventDefault(); // doesn't help
});