Zach Nicodemous
Zach Nicodemous

Reputation: 9487

jQuery hover issue on mouseout

I am using the jQuery variable "mouseover" and "mouseout" to show a DIV element when hovering over another.

http://74.54.17.66/~adbuynet/case-studies/ - If you hover over "Call to Action" in the top right, you see a dropdown.

The problem is, that when mousing over the dropdown itself, the dropdown starts acting funky and does not stay open. My jQuery code is:

    $("#call-to-action").mouseover(function(e) {     
    $("#call-to-action-dropdown").show("slide", { direction: "up" }, 200);  
    e.stopPropagation();
  });
  $("#call-to-action").mouseout(function(e) {     
    $("#call-to-action-dropdown").hide("slide", { direction: "up" }, 200);  
  });
}); 

What mistake have I made please?

Upvotes: 0

Views: 595

Answers (1)

Daniel Brockman
Daniel Brockman

Reputation: 19270

Use mouseenter and mouseleave instead of mouseover and mouseout. See http://api.jquery.com/mouseenter/.

(You’ll almost never want to use mouseover/mouseout, and when you do, you’ll know it.)

Upvotes: 2

Related Questions