Infinity Scroll

How to Use

1. 1

   Add the Following Code after the Portfolio #portfolio Container:

   
   	[Load more...](portfolio-infinity-scroll-2.html)
   

   Note: Make sure you create a page with name portfolio-infinity-scroll-2.html & place the next Set of Portfolio Items in it. Then the next set will have the name portfolio-infinity-scroll-3.html and so on..

2. 2

   Script for Infinity Scroll:

   
   
   	jQuery(window).load(function(){
   
   		var $container = $('#portfolio');
   
   		$container.isotope({ transitionDuration: '0.65s' });
   
   		$('#portfolio-filter a').click(function(){
   			$('#portfolio-filter li').removeClass('activeFilter');
   			$(this).parent('li').addClass('activeFilter');
   			var selector = $(this).attr('data-filter');
   			$container.isotope({ filter: selector });
   			return false;
   		});
   
   		$('#portfolio-shuffle').click(function(){
   			$container.isotope('updateSortData').isotope({
   				sortBy: 'random'
   			});
   		});
   
   		$(window).resize(function() {
   			$container.isotope('layout');
   		});
   
   		$container.infinitescroll({
   			loading: {
   				finishedMsg: '',
   				msgText: '',
   				img: "images/preloader-dark.gif",
   				speed: 'normal'
   			},
   			state: {
   				isDone: false
   			},
   			nextSelector: "#load-next-posts a",
   			navSelector: "#load-next-posts",
   			itemSelector: "article.portfolio-item"
   		},
   		function( newElements ) {
   			$container.isotope( 'appended', $( newElements ) );
   			var t = setTimeout( function(){ $container.isotope('layout'); }, 2000 );
   			SEMICOLON.widget.loadFlexSlider();
   			SEMICOLON.portfolio.arrange();
   		});
   
   	});