How to close a javascript menu -

I'm opening the pulldown menu that should be clicked to open it. This code allows users to fix the menu that opens. The only problem is that I do not know how to close the menu by clicking outside the menu. I showed "document.onclick", but it also has an effect in the menu.

I think I need to stop the document. Click if captured by other elements, but I'm not sure how to do this cross-platform, can anyone show me how?

  & lt; Script type = "text / javascript" & gt; Var previous openaemuid = null; Function ShowMenu (menuId) {If (Last Open Manuid! = Null & Previously Open MenuID! = MenuEd) {HideEstream Menu (); } SetMenuVisibility (menuId, 'visible'); Previous Open MenuID = Menu ID; } Hide function menu (menuId) {setMenuVisibility (menuId, 'hidden'); } Hide the function: Steinemain () {If (last manidem! = Null) {menu (last opened menuID); }} Function Set MenuUsubility (MenuEnd, View Oriented) {var menuElement = document.getElementById (menuId); MenuElement.style.visibility = visibleOrHidden; } Document.onclick = hideLastOpenedMenu; & Lt; / Script & gt; & Lt; Div onmousedown = "showMenu ('foodmenu')" & gt; & Lt; A & gt; Food & lt; / A & gt; & Lt; / Div & gt; & Lt; Div id = "foodmenu" onmouseup = "menu ('food menu');" & Gt; & Lt; A href = "# meat" & gt; Meat & lt; / A & gt; & Lt; A href = "# tofu" & gt; Tofu & lt; / A & gt; & Lt; / Div & gt;  

Thanks in advance.

---

I have made some progress and have corrected the question here:

< P> Depending on whether you have a page layout:

  & lt; Body & gt; & Lt; Div id = "menu" & gt; & Lt ;! - Menu content - & gt; & Lt; / Div & gt; & Lt; Div id = "main" & gt; & Lt ;! - Home page content - & gt; & Lt; / Div & gt; & Lt; / Body & gt;  

You can insert the onClick handler to close the menu with the id "main" which