CODEWITHSUNDEEP
jquerycss
esims
esims

Reputation: 420

Prevent mouseenter event parent

From what I have read in this question, I would expect that when I enter a div by hitting a child element first, the mouseenter event of the parent does not fire. However, it does.

Here is an example to make it clear. I want the mouseenter event only to fire when I hit the blue area, not when I hit the child element. Is it possible?

Upvotes: 1

Views: 842

Answers (1)

Dániel Kis-Nagy
Dániel Kis-Nagy

Reputation: 2495

That's because of the event bubbling. If a child element doesn't handle an event, their parent will have the chance to do it.

If you want to prevent this from happening, you will need to handle the event at "child-level". If you return false in your event handler, the event will stop traversing the DOM, and the parent's event handler won't run.

Example on CodePen

Upvotes: 2

Related Questions