Infinite Scroll Load More Data

https://stackoverflow.com/questions/47470261/how-do-i-trigger-function-at-the-end-of-div-scrolling

by Patrick Hund

HTML

<p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan, massa non ultrices ullamcorper, diam neque luctus metus, volutpat varius mauris ex et nibh. Nunc bibendum tellus vel ullamcorper tincidunt. Sed hendrerit mollis sem, sit amet
    dictum justo bibendum in. Quisque aliquet elit sit amet sapien egestas molestie eu at eros. In cursus felis quis erat vehicula pretium. Donec accumsan ac leo ut mattis. Aliquam iaculis in nisl sed aliquet.
</p>
<p>
    Duis id sagittis felis, eget cursus tortor. Pellentesque pellentesque libero lacus, non hendrerit orci laoreet ut. Integer in auctor leo. Sed a enim nunc. Nam bibendum dictum augue, eu tempus nisl. Fusce velit magna, condimentum vitae enim volutpat, posuere
    finibus velit. Nulla eu luctus augue, id ultricies ipsum. Ut porta elementum porta. Aenean quis velit ex.
</p>
<p>
    Integer dui lorem, volutpat sit amet tortor vitae, placerat tincidunt eros. Donec gravida urna ac magna faucibus, et tempor sem maximus. Curabitur vulputate scelerisque lectus ut elementum. Donec porttitor vitae elit eget vehicula. Nulla pretium urna
    mollis sapien feugiat, et scelerisque velit rutrum. Aenean gravida mollis consequat. Nam ac accumsan ligula. Fusce in dolor placerat, dictum urna id, consequat est. In imperdiet non ligula sit amet feugiat.
</p>
<p>
    Nunc odio nulla, pellentesque non placerat vel, egestas quis nunc. Ut laoreet metus ac elit pulvinar pharetra. Quisque est lectus, vehicula quis nunc vel, elementum faucibus velit. Sed nec magna semper, convallis orci id, venenatis nulla. Ut dapibus ullamcorper
    nisl ut ultrices. Fusce eget suscipit sapien. Vestibulum non dolor ac lorem ultricies sodales quis ac lectus. Morbi eleifend consequat dui, id dictum dolor mattis sed. Aliquam ac mauris sed justo maximus convallis sodales sit amet augue. Fusce at
    venenatis sem. Nullam cursus ipsum dolor, ac vehicula urna porta euismod.
</p>
<p>
    Vivamus finibus efficitur felis ut iaculis. Aenean...

JavaScript

$(window).scroll(function() {

    if ($(window).scrollTop() + $(window).height() >= $(document).height()) {
        var last_id = $(".post-id:last").attr("id");
        alert(last_id);
        loadMoreData(last_id);
    }
});

function loadMoreData(last_id) {
    $.ajax({
            url: 'loadMoreData.php?last_id=' + last_id,
            type: "get",
            beforeSend: function() {
                $('.ajax-load').show();
            }
        })
        .done(function(data) {
            $('.ajax-load').hide();
            $("#post-data").html(data);
        })
        .fail(function(jqXHR, ajaxOptions, thrownError) {
            alert('server not responding...');
        });
}