Question: I am using the jQuery UI Menu as a context menu, so when a user clicks on a cell in a table, it brings it up with relevant options. The problem is, it wasn't really designed to be used like this, so it doesn't hide when the user clicks outside of the menu.

I tried using the blur method:

```
$("#menu").menu({
    blur: function( event, ui ) {
        $("#menu").css('top', '-1000px');
        $("#menu").css('left', '-1000px');
    }
});

```

For some reason though, the menu hides even if you scroll onto one of the options in the menu.

Is there a simple solution for this? 

**Edit:**
To pull up the menu I use:

```
$("table.adminScheduleViewer tr td:nth-child(4), table.adminScheduleViewer tr td:nth-child(5), table.adminScheduleViewer tr td:nth-child(6), table.adminScheduleViewer tr td:nth-child(7), table.adminScheduleViewer tr td:nth-child(8), table.adminScheduleViewer tr td:nth-child(9), table.adminScheduleViewer tr td:nth-child(10)").click(function(event){
    $("#menu").css('top', event.pageY);
    $("#menu").css('left', event.pageX);
});

```

That always seems to get called first if I try to use a $('body').click() to hide it. Can you change the order jQuery handles clicks?

Answer: 
```
 $('body:not(#menu)').click(function(){
     $("#menu").css({ 'top' : '-1000px', 'left' : '-1000px' });
 });

```

I think this way is a little sexier
how about something like: 

```
           $('body').not($('#menu').find('*'))
             .bind('click',function(){
                $("#menu").css('top', '-1000px');
                $("#menu").css('left', '-1000px');
             });

```

Lets handle clicks on the body, and if the click happens NOT anywhere on the menu, do your hiding.