Question

Is there a recommended way to go about lazy load/infinite scroll content in a jquery mobile app and how can i do that on individual “pages”?

Should i defined a scroll event function on the pageshow of a page? something like the following?

$( document ).delegate("#a_jquery_page", "pageshow", function() {

    $(window).scroll(function(){
        //check scroll position and load content  
    });
});

Or should i use setInterval function that checks the scroll position every second or half second or something?

Answer 1

The .scroll event is called everytime the window is scrolled, you would simply check the window position in this function. There is no reason for an interval function.

$(window).scroll(function () { 
    var height = $(window).height();
    var scrollTop = $(window).scrollTop();

    if (scrollTop == ....) { <code> }
}