I am using this code:
$('body').click(function() {
$('.form_wrapper').hide();
});
$('.form_wrapper').click(function(event){
event.stopPropagation();
});
And this HTML:
<div class="form_wrapper">
<a class="agree" href="javascript:;">I Agree</a>
<a class="disagree" href="javascript:;">Disagree</a>
</div>
The problem is that I have links inside the DIV and when they no longer work when clicked.
You might want to check the target of the click event that fires for the body instead of relying on stopPropagation.
Something like:
Also, the body element may not include the entire visual space shown in the browser. If you notice that your clicks are not registering, you may need to add the click handler for the HTML element instead.
Here's a jsfiddle I found on another thread, works with esc key also: http://jsfiddle.net/S5ftb/404
i did it like this: