Infinite scroll

2 comments

Here is the code


/* example of infinite scroll */
$(window).scroll(checkLoadMore);
$(document).ready(checkLoadMore);
var itemPos = 0;

function checkLoadMore() {
	// Check if we are at the bottom and if so, add more tiles
	var pos = getDocumentHeight();
	var clientHeight = $(window).height();
	var scrollPos = $(document).scrollTop();
	var height = pos - clientHeight;

	if (scrollPos >= height - 600) {
		// We are at the bottom so attempt to load more
		$('#something-list').append('<div id="something-loading"></div>');
		loadMore();
	}

};

function loadMore() {
	// load more from server
	var url = websiteBaseUrl + 'something/loadmore?filter=whatever&pos=' + itemPos;
	$.get(url, function (html) {
		$('#something-list').append(html)
	})
}

function getDocumentHeight() {
	var D = document;
	return Math.max(Math.max(D.body.scrollHeight, D.documentElement.scrollHeight), Math.max(D.body.offsetHeight, D.documentElement.offsetHeight), Math.max(D.body.clientHeight, D.documentElement.clientHeight));
};
/* end example of infinite scroll */

Comments


Leave a Comment