Steve Wellens pointer-events Demo

Shows how CSS pointer-events work.

HTML

<div id="MyDiv" >
    <input type="button" id="MyButton" value="Click Me!" />
    <img  id="MyImage" src="http://weblogs.asp.net/blogs/stevewellens/2012/cherry_3_shadow.png"  />
</div>

CSS

#MyDiv
{
    vertical-align: top; 
    position:relative;  
}
#MyButton
{
    position: absolute; 
    top: 70px; 
    left: 80px;
}

#MyImage
{
    position: absolute;
    top: 0px; 
    left: 0px;
    width: 500px;
    height: 500px;
    pointer-events: none;
    z-index:5;
}

JavaScript

$("#MyButton").click(
    function()
    {
        $("body").append("You clicked me!  ");
    }
);