molendijk

If you want a click event (computer, laptop) or a touchstart event (mobile device) to occur when an arbitrary part of your page is clicked on ('touched') but if you don't want this event to occur (or if you want other events to occur) for regions of your page having a certain id or class name, then jQuery is your friend.

Code:

<script>
$(document).on("click touchstart", function (e){
if(e.target.id=='bla'){do this} else {do that}
if(e.target.className=='blo'){do this} else {do that}
if(e.target.id!=='bla'){do this} else {do that}
if(e.target.className!=='blo'){do this} else {do that}
});
</script>

etc.
This code helped me to hide a submenu when I hit / touched some part of the page outside the submenu, and to display it when I hit / touched a link that was supposed to display the submenu.