I am looking for a how-to article or tutorial to load content dynamically. Endless scrolling is not the objective. A site I am working on has over 300 divs consisting of an image, a caption and a bit of other text. To load all those divs is okay on a desktop browser but on a phone or tablet the page becomes very heavy. I want to load in 6-10 initially and successive AJAX calls would load another 10 as the user gets closer to the bottom of the browser window. It’s anticipated the user won’t scroll to the bottom but if they do, I want the content finite.
I have been using ‘jquery endless scrolling codeigniter’ and variations close to that in Google. The closest I have come to a relevant article is http://www.technicalkeeda.com/jquery/load-data-on-page-scroll-using-jquery-php-codeigniter-and-mysql. This article does not address my needs for there seems to be no logic to limit the number of rows from the database. As well. I want the AJAX call to return HTML, not JSON, so the new content simply floats in without extra work on the part of the browser to process JSON data.
Are there other tutorials out there that will assist to learn with CI? I am novice with CI and jQuery AJAX. MVC is good but sometimes it makes acquiring to techniques difficult to learn.