jQuery Events for Start/Stop Scrolling
The plugin below can be dropped into its own file and included into your page, then used with JQ.
/**
* Adds support for the special browser events 'scrollstart' and 'scrollstop'.
*/
(function(){
var special = jQuery.event.special,
uid1 = 'D' + (+new Date()),
uid2 = 'D' + (+new Date() + 1);
special.scrollstart = {
setup: function() {
var timer,
handler = function(evt) {
var _self = this,
_args = arguments;
if (timer) {
clearTimeout(timer);
} else {
evt.type = 'scrollstart';
jQuery.event.handle.apply(_self, _args);
}
timer = setTimeout( function(){
timer = null;
}, special.scrollstop.latency);
};
jQuery(this).bind('scroll', handler).data(uid1, handler);
},
teardown: function(){
jQuery(this).unbind( 'scroll', jQuery(this).data(uid1) );
}
};
special.scrollstop = {
latency: 300,
setup: function() {
var timer,
handler = function(evt) {
var _self = this,
_args = arguments;
if (timer) {
clearTimeout(timer);
}
timer = setTimeout( function(){
timer = null;
evt.type = 'scrollstop';
jQuery.event.handle.apply(_self, _args);
}, special.scrollstop.latency);
};
jQuery(this).bind('scroll', handler).data(uid2, handler);
},
teardown: function() {
jQuery(this).unbind( 'scroll', jQuery(this).data(uid2) );
}
};
})();
Written by John Paul Barbagallo
Related protips
5 Responses
what we can do with this ?
over 1 year ago
·
@modaloda try it out :) it's for capturing begin and end scroll events.
over 1 year ago
·
// Seriously?
var TO = false;
var scroll_static = true;
$(window).scroll(function(){
if( scroll_static ){
console.log('start scrolling');
scroll_static = false;
}
if(TO !== false){ clearTimeout(TO); }
TO = setTimeout(myfunction, 200);
});
function myfunction(){
scroll_static = true;
console.log('stopped scrolling');
}
</code></pre>
200 is trigger offset time.
over 1 year ago
·
Woah, seriously bro? Drop your code into a browser and see if it works.
You should test your shit before trolling someone elses.
over 1 year ago
·
how to use this plugin?
i need to put some css over scroll start and scrollstop events.
over 1 year ago
·
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Browser
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#