SwiftMango
SwiftMango

Reputation: 15284

How to trigger hover when mouse on a child div

I have this:

<div id='hasHover'>
  <div id='inner-button' style='display:none'>Click</div>
</div>

$('#hasHover').hover(function(){
  $('inner-button').toggle();
});

This works fine. However when I move my mouse to the button, the button disappears(or flashes really fast). How to make sure the button stays when the mouse is hovering on the div (including child div)?

Upvotes: 0

Views: 73

Answers (2)

Talha Akbar
Talha Akbar

Reputation: 10030

$('#hasHover').hover(function(e) { // <-- Create event argument
  if(e.target.id == "hasHover") { // <-- Check the ID of the div on which event fired
     $('#inner-button').toggle(); // <-- You missed # here
     return false;
  }
  else {
     return false;
  }
});

Upvotes: 1

EnterJQ
EnterJQ

Reputation: 1014

check the target id

$('#hasHover').hover(function(e) {
   if(e.target.id = "hasHover") {
      $('inner-button').toggle();
   return false;
   }else {
    return false;
   }
}); 

Upvotes: 0

Related Questions