Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I have 2 elements a parent element and its child, and both are absolutely positioned.
I have a click handler for each element, although when I click the child element the parent element behind it also catches the click.
How do I prevent the parent element from receiving the click event?
If you want a pure CSS solution, you could use
pointer-events: none;. This will make sure your mouse ignores the parent element, for good, so be careful in your use of it.Also note this is NOT SUPPORTED in IE or Opera. (Or at least, not on HTML elements, just SVG)
jQuery alternative is e.StopPropagation, more info can be found here