question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

mouseover and mouseout events do not behave like mouseenter and mouseleave on markers

See original GitHub issue

According to #1144 Leaflets mouseover and mouseout should behave like mouseenter and mouseleave. However this fiddle shows that this is not the case.

If you move the mouse over the outer ring of the marker the popup shows up but as soon as you enter the inner circle it is closed because mouseout is fired. If you move back to the outer ring the popup shows up again.

Issue Analytics

  • State:closed
  • Created 8 years ago
  • Reactions:1
  • Comments:13 (10 by maintainers)

github_iconTop GitHub Comments

4reactions
stuharveycommented, Aug 2, 2016

For v0.7.7 users having a similar issue and arriving here via google or otherwise, I’ll give my $0.02 on a good way to handle this rather than just offsetting the popup: fiddle.

On a related note, I also wanted to find a way to avoid triggering the mouseout event on a marker when adding a new feature on or around it. In my application, I’m displaying GPS data which has an error radius for each GPS fix. I wanted to be able to mouse over a marker for a given data point and show that error, but I ran into the same issue where adding a layer or showing a popup when mousing over a marker would trigger the marker’s mouseout event.

Here’s a fiddle showing the undesired behavior and how to fix it.

2reactions
Eschoncommented, Aug 5, 2015

@fminuti Your right it seems that there isn’t really an issue. Now I have the problem that I need to be able to move the mouse over the popup because there are links inside it. But that isn’t really something that leaflet is responsible for so I’ll find some way to work around it in my code.

@yohanboniface feel free to close if you agree that there is no issue in Leaflet.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Moving the mouse: mouseover/out, mouseenter/leave
The mouseover event occurs when a mouse pointer comes over an element, and mouseout – when it leaves. These events are special, because...
Read more >
Mouseover and Mouseout listener for Google Maps marker
The key is to set animation only when it is not set already, as: google.maps.event.addListener(marker, 'mouseover', function() { if (this.
Read more >
MouseEnter and MouseLeave VS. MouseOver and MouseOut
On the surface, MouseEnter and MouseOver seem to do the same thing. However, there is a difference in how they handle event bubbling...
Read more >
UI Events - W3C
The mouseover / mouseout events are only fired once, while mouseenter / mouseleave events are fired three times (once to each element).
Read more >
Moving the mouse: mouseover/out, mouseenter/leave - W3docs
The mouseover event takes place when the pointer of the mouse comes over an element. On the contrary, the mouseout event occurs when...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found