Posted By: Anonymous
I have a
div that has
background:transparent, along with
border. Underneath this
div, I have more elements.
Currently, I’m able to click the underlying elements when I click outside of the overlay
div. However, I’m unable to click the underlying elements when clicking directly on the overlay
I want to be able to click through this
div so that I can click on the underlying elements.
Yes, you CAN do this.
pointer-events: none along with CSS conditional statements for IE11 (does not work in IE10 or below), you can get a cross browser compatible solution for this problem.
AlphaImageLoader, you can even put transparent
.PNG/.GIFs in the overlay
div and have clicks flow through to elements underneath.
pointer-events: none; background: url('your_transparent.png');
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='your_transparent.png', sizingMethod='scale'); background: none !important;
Here is a basic example page with all the code.