jQuery slideToggle menu that will collapse if

anything except the link and the body of the exposed div are clicked after the event is fired and only after the event is fired

$(function() {
    $('#engageNetwork').bind('click', function() {
        $('.topNavSlide').stop(true,true).slideT开发者_StackOverflowoggle(1000, 'easeOutExpo');
        $('a').click(function() {
            $('.topNavSlide').stop(true,true).slideToggle(500, 'easeOutExpo');
        });
    });
});

You can use the :not selector in order to bind the rest of the document click handler that will collapse the menu. The selector and the binding is something like:

$(":not(#engageNetwork, #engageNetwork *)").bind("click", function(){
   $('.topNavSlide').stop(true,true).slideUp(1000, 'easeOutExpo');
});

(the second reference to #engageNetwork with the asterisk is in place to make sure any elements under the #engageNetwork won't be binded with this event handler.)