title: jQuery navigation mega menu by click not hover
body: <p>I've got a navigation menu that I would like to have certain links display a sub-menu underneath, here is the general layout <a href="http://jsfiddle.net/hcharge/HGtTz/" rel="nofollow">http://jsfiddle.net/hcharge/HGtTz/</a></p>
  
  <p>Before I've used jQuery hoverintent to display the menu beneath, however this time I would like it to display without the hover and by click and to be able to navigate with the keyboard by tabbing.</p>
  
  <p>I'm very new to jQuery and I've tried to get the menu displaying without any luck, is somebody able to point me in the right direction?  I'm sure this is pretty simple, with a display none on the dropdown-inside and then slidedown with a click or something?</p>
  
  <p>The menu also needs to close if you click outside the box or another link.  Thanks very much.</p>