Untitled

<!-- jQuery kütüphanesini sayfaya ekleyin -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<script>
$(function() {
    // İlk 5 kartı yükle
    loadCards(0, 5);

    // Sayfa aşağı kaydırıldıkça daha fazla kart yükle
    var isLoading = false;
    $(window).scroll(function() {
        if ($(window).scrollTop() + $(window).height() >= $(document).height() - 100 && !isLoading) {
            isLoading = true;
            var startIndex = $('#card-container .card').length;
            loadCards(startIndex, 5, function() {
                isLoading = false;
            });
        }
    });
});

function loadCards(startIndex, count, callback) {
    $.getJSON('/data', function(data) {
        var html = '';
        for (var i = startIndex; i < startIndex + count; i++) {
            if (i >= data.length) break;
            var item = data[i];
            html += '<div class="card">' +
                    '<div class="card-header">' + item.title + '</div>' +
                    '<div class="card-body">' + item.body + '</div>' +
                    '</div>';
        }
        $('#card-container').append(html);
        if (callback) callback();
    });
}
</script>