На мой взгляд это самое простое решение по внедрению бесконечной прокрутки. Для его реализации используется плагин «
Infinite Ajax Scroll».
Внедрение:
1. Скачать и подключить плагин
Код:<script src="/js/jquery.ias.min.js"></script>
2. В компоненте (в суффиксе) вместо обычной постраничной навигации вывести
Код:<?=($nextLink?"<div class='pagination'><a href='$nextLink'>→</a></div>":null)?>
этот блок не будет отображаться
3. Прописать вызов и атрибуты плагина
Код:$(function() {
jQuery.ias({
container : ".list",
item : ".list-item",
pagination : ".pagination",
next : ".pagination a",
loader : "<img src='/img/loading.gif'>"
});
});
Пример структуры:
Код:<div class='list'>
<div class='list-item'>Новость 1</div>
<div class='list-item'>Новость 2</div>
<div class='list-item'>Новость 3</div>
<div class='list-item'>Новость 4</div>
<div class='list-item'>Новость 5</div>
<div class='pagination'><a href='<?=$nextLink?>'>→</a></div>
</div>
Скачать с сайта разработчика
Комментарии 1