jqury lazy scroll

by Prasad

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div>
  <div class="scrollbar">
  
  </div>
</div>

CSS

div {
  height: 600px;
}
div.scrollbar {
  height: 2000px;
}

JavaScript

var scrolledpos = 0;
var lastScrolledPos = 0;
var root = 'http://jsonplaceholder.typicode.com';
var jsonData = 0;
var gblID = 0;
loadData();

$(document).on('scroll',function(){
	scrolledpos = $(window).scrollTop();
  if(scrolledpos >= lastScrolledPos) {
  	console.log("scrolledpos" + scrolledpos + " ,lastScrolledPos: " + lastScrolledPos);
	//Store last scrolled position, if user scroll up and again
  //scroll down so you get last scroll position  
	lastScrolledPos = $(window).scrollTop();
	$('body div.scrollbar').append("<br>" + addData());
				
	}
});

function loadData() {
$.ajax({
  url: root + '/posts/1',
  method: 'GET'
}).then(function(data) {
  console.log(data);
	jsonData = data;	
	gblID = jsonData.id;
});
	
}

function addData() {	
	gblID++;	
return gblID;	
}