This is the demo of the jQuery responsiveness v0.1 plugin. Get the latest version here.
The point of this demo is to show that the plugin only calls the function once when the user finishes typing into the box. Imaging that each time the user
typed a key, a really expensive function needed to be called, but it only _really_ needed to be called once, at the end.
You can use this plugin to split up the UI updates from the expensive processing needed in the background, and make the UI look very responsive.
I wrote a blog about this plugin here
type really fast into here using a bunch of keys:
Called on every key press:
ready
Called on every key press using plugin:
ready
Now for something different, here is a hoverIntent "like" implementation using this plugin. It does not poll the
mouseover event, it does not use the mouse x and y position. it will check if a mouseMove was detected in the last 500ms, and run some function. if you mouseOut, the process starts all over again. Granted,
it does not work exactly how hoverIntent works, but it could be tweaked to check the speed of mousemove firing, and then we could implement hoverIntent fully.
hover mouse over me
Here is the code that drives this implementation:
API:
var r = $.getResponsiveness({interval:100, times:5}):
* create a new responsiveness object instance, which checks for new function calls every 100ms, and if no new function calls happened for 5 such checks, fires last function call.
r.run(fn, args, context):
* use above instance to run a function. context is optional, if none is provided, window is used. args is an array of aruments to function fn.
r.disable():
* stop the internal timer, run() function no longer does anything.
r.enable():
* if object was disabled, this will enable it, run() works as described.
r.reset():
* resets the internal timer. no more functions will be fired until one more run() is called.