I use a generic version of the waiting-for-pause trick:<p><pre><code> // execute callback only after a pause in user input; the function returned
// can be used to handle an event type that tightly repeats (such as typing
// or scrolling events); it will execute the callback only if the given timout
// period has passed since the last time the same event fired
function createOnPause(callback, timeout, _this) {
return function(e) {
var _that = this;
if (arguments.callee.timer)
clearTimeout(arguments.callee.timer);
arguments.callee.timer = setTimeout(function() {
callback.call(_this || _that, e);
}, timeout);
}
}
</code></pre>
Use it like this:<p><pre><code> document.addEventListener('scroll', createOnPause(function(e) {
// do something interesting here
}, 1500, this), false);
</code></pre>
Edit: Oops! The version in the article runs some code if any scroll event occurred since it last fired, but this one doesn't execute the callback until the user stops scrolling for some amount of time. Anyway, maybe it's still useful for some folks.