Geek Answers Handbook

JQuery: mouseenter / mousemove / mouseover is not recognized with a small div and fast mouse movement

I have a div with width: 5px and height: 400px (for example). If I want to run a function when this div freezes, the event is not recognized when I move my mouse too fast (it doesn't matter, I use the mouse mouseover / mouseenter / mousemove).

Here you can see a working example: http://jsfiddle.net/2YZvk/

This is my function:

jQuery(document).ready(function(){ jQuery('.hover_test').bind('mouseenter',function(){ jQuery(this).css('background-color','#30a900'); }); });

Is it possible to somehow trigger this event, even if I move the mouse too fast? Making a wider div is not an option ...

+1
source share
2 answers

It’s just “how the browser works”; it just does not fire an en event for every pixel that you touch, but for every x-millisecond. It checks if the position of the previous position of your pointer is different, and then the event will light up. This is done through the OS.

Move your mouse over this modified version of your JSFiddle . Not all bands will be colored directly: only after the x-milliseconds defined in your browser.

0
source

When you move the mouse to fast, the speed (for example) is 5 and 5 + 5 + 5 + 5 = 20, so the steps you can touch are 5, 10, 15, 20, but if the div is at 7, 14, 18 it won't happen, its just the way it works

0
source

More articles:


All Articles