Scrolowanie i ładowanie ajaxa. Opcje

[Lord]

[PHP] pobierz, plaintext 
    <script>
		$(window).load(function(){
 
			$('.grid').masonry({
			  itemSelector: '.grid-item',
			  columnWidth: '.grid-sizer',
			  percentPosition: true
			});	
 
 
			var boxsPages = new Array(["3","11","5","15","13","2","10","8","14","7","6","12"], ["16","17","1","9","4","3","11","5","15","13","2","10"], ["8","14","7","6","12","16","17","1","9","4","3","11"], ["5","15","13","2","10","8","14","7","6","12","16","17"], ["1","9","4","3","11","5","15","13","2","10","8","14"]);
			var numberPage = 0;
			function yHandler(){
				// Watch video for line by line explanation of the code
				// http://www.youtube.com/watch?v=eziREnZPml4
 
				var wrap = $('#posts');
				var contentHeight = wrap.height();
				var yOffset = $(window).scrollTop(); 
				var y = yOffset + $(window).innerHeight();
				if(y >= contentHeight && numberPage <= 5){
					$.ajax({
						type: "POST",
						url: "ajax_post.php",
						pages: boxsPages[numberPage],
 
						success: function(result) {
							//alert(result);
							console.log("ajax="+numberPage);
							var $items = $(result);	
							$('.grid').append($items).masonry('appended', $items);
							numberPage++;						
						}
					});
					//console.log(numberPage);				
 
 
				}
				//var status = document.getElementById('status');
				//status.innerHTML = contentHeight+" | "+y;
			}
			window.onscroll = yHandler;
 
		});	
 
	</script>  
[PHP] pobierz, plaintext 

Korzystam z 2 rozwiązań:
https://www.developphp.com/video/JavaScript...ach-Bottom-Ajax
http://masonry.desandro.com/

strona oparta o boostrap.

I jest problem. Bo nie wiem dlaczego (chociaz domyslam się, że może jakiś problem z łapaniem wyskości jest problem), ale zamiast ładować się raz to ajax laduje mi sie 4x. Ogólnie założenie ma być takie, że przesyłam z tablicy boxsPages kolejne elementy tablicy z zapisanymi id postów jakie mają mi się ładować gdy osoba przewija strone. ale nie chodzi to tak jak chce. Może ktoś pomoże ? co może być nie tak?


Ok zrobiłem pomogła mi ta strona (przyklad 2)
----------------------
https://www.sitepoint.com/jquery-infinite-scrolling-demos/


Ten post edytował Lord 4.10.2016, 16:03:00