Skip to content

Instantly share code, notes, and snippets.

@joshuaadrian
Last active August 29, 2015 14:09
Show Gist options
  • Save joshuaadrian/bc3888c41c5feac55211 to your computer and use it in GitHub Desktop.
Save joshuaadrian/bc3888c41c5feac55211 to your computer and use it in GitHub Desktop.
JS function to track user scrolling
(function() {
var Scroller = {
init: function() {
this.scrollWindow = $(window);
this.scrollDocument = $(document);
this.scrollElements = $('body > div');
this.windowHeight = this.scrollWindow.height();
this.documentHeight = this.scrollDocument.height();
this.scrollTopCurrent = this.scrollWindow.scrollTop();
var parent = this;
this.scrollWindow.scroll( function() {
var scrollerTop = parent.scrollWindow.scrollTop();
console.log( parent.scrollDirection( scrollerTop ) );
console.log( parent.scrollPercentage( scrollerTop ) );
console.log( parent.scrollPixel( scrollerTop ) );
console.log( parent.scrollElement( scrollerTop ) );
});
},
scrollDirection: function( scrollerTop ) {
var direction = '';
if ( this.scrollTopCurrent < scrollerTop ) {
direction = 'down';
} else {
direction = 'up';
}
this.scrollTopCurrent = scrollerTop;
return "Scroll Direction : " + direction;
},
scrollPercentage: function( scrollerTop ) {
var percent_scrolled = 0;
percent_scrolled = Math.round( ( scrollerTop / this.documentHeight ) * 100 );
return "% Scrolled : " + percent_scrolled;
},
scrollPixel: function( scrollerTop ) {
var pixelsScrolled = 0;
pixelsScrolled = scrollerTop;
return "Pixels Scrolled : " + pixelsScrolled;
},
scrollElement: function( scrollerTop ) {
this.scrollElements.each( function( index ) {
var element = $(this);
var elementHeight = element.height();
var elementOffset = element.offset();
var elementClass = element.attr('class');
var elementVisible = scrollerTop < ( elementHeight + elementOffset.top ) ? elementClass + ' is visible' : elementClass + ' is not visible';
return elementVisible;
});
}
}
Scroller.init();
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment