Lazyloading in Mobile App


Lazyloading in Mobile App

4 years, 11 months ago
Hi Guys, We have written code to load records while scrolling down page (lazyloading) in Cordova Mobile App.

It improves UI/ UX and code is easy to manage.

Please go through below description and code:

Trick we have used: we load the records, when load-more div is visible on scrolling down.

We have implemented the same in Jito App and it's working fine.

# Please refer below code:-

We have taken code reference from Enquiry listing page of Jito App.

<div id="enquiry-loadmore" class="loadmorediv" data-start="0">		<!-- Add  class 'loadmorediv' to your loadmore div -->
	Load More 
	<span class="loadmore-count"></span>

Java Script:
lazyLoading();								//this function is responsible for Loading records on scroll down

function lazyLoading(){
	var temp = 1;
	$('#pages_maincontent,.search_members_wrap,ul').scroll(function(){		// 'pages_maincontent' is id of main div
		var e = $('.loadmorediv');


			if(e && $(".loadmorediv").is(":visible")){
		    		var url = window.location.href ;
		    		var id = getParameterByName('id',url);
	    			var is_number = Number.isInteger(id);
	    			var is_number = true;

		    	if(is_number && temp == '1'){
					jQuery(".loadmorediv").trigger("click");	// triggers when load-more div visible

Refer Jito App code for the same.

Note: Latest code is available on GIT.
Last Edit: 4 years, 11 months ago by Aadarsh Jain.
  • Page:
  • 1

Latest Forum Posts