Justified Gallery infinite scroll


In this example you can see how to obtain an infinite scroll using the JQuery plugin made by Paul Irish.

The first thing to do is to initialize the gallery as usually.

$('#gallery').justifiedGallery({rowHeight:180});
Then you need to initialize the infinite scroll as you want. But is necessary to implement its finish callback to recall Justified Gallery again.

$('#gallery').infinitescroll({
		navSelector : "#next:last",
		nextSelector : "a#next:last",
		itemSelector : "#gallery a",
		dataType : 'html',
		maxPage : 3,
		path: function(index) {
			return "infinite_scroll_pag" + index + ".html";
		}
	}, function(newElements, data, url) {
		$('#gallery').justifiedGallery('norewind');
	}
);
You can notice that we call Justified Gallery using the special parameter 'norewind'. In this way the plugin don't re-analyzes all the images, but only the new. This parameter increases the performance, but also prevents the page to have strange behaviours with the scrollbars.

Note that the Infinite Scroll plugin may have problems loading the next pages when this demo is executed as a local file in your disk. You can notice those errors in the console. Execute this demo using a Web server (e.g. your local web server).