jQuery hide div on mouseout

Question

I saw a lot of posts on this item, but couldn\'t find the right solution. Sorry if it\'s already answered somewhere.

What I want: I have a DIV

Answer 1

if i understand the "is not above the href element" piece, you want the menu to stay visible when mousing off of div#menudiv, but still moused over a#menu_opener ??

if that's the case, i'd wrap the entire thing in a unqiue div and target that. and use mouseleave over mouseout.

http://api.jquery.com/mouseleave/

so, your HTML becomes:

  

    Menu
  
  

    Page 1

    Page 2
 
    Page 3
                           
  

and your script would be something like:

$("#menu_opener").click(function () {
  if ($("#menudiv").is(":hidden")) {
      $("#menudiv").slideDown("slow");
  } else {
      $("#menudiv").hide();
  }
});
$("#menu_container").mouseleave(function(){
    $('#menudiv').hide();
});