Grasss

Подгрузка контента при прокрутке страницы (как в соцсетях)

Recommended Posts

Доброго времени суток. Имеется блог в виде длинной страницы (70 div блоков с контентом "фото+текст") 
Нужно чтобы при заходе на сайт отображались первые 3-4 поста и далее по ходу прокрутки страницы автоматически подгружались остальные. Пример можно посмотреть в соцсетях вк/ок/fb/insta. Как это реализовать? Желательно на чистом PHP и JavaScript, без использования базы данных.

Share this post


Link to post
Share on other sites

var page = 0;
$(document).on('scroll', function()
{
//проверяем сколько px до конца страницы осталось https://learn.javascript.ru/metrics-window
//если осталось меньше какого-то конкретного числа, которое вам больше подходит делаем ajax запрос на скрипт который подгрузит вам нужную часть, увеличив ее индекс page+1, и вставить в какой-нибудь элемент content. Что-нибудь вроде:
  $.post('/content.php',{'page':page},function(data)
  {
    $(content).append(data);
  });
});
В '/content.php' что-нибудь вроде:
<?PHP
switch ($_POST['page']) {
    case 0:
        echo "<div>div1</div>";
        break;
    case 1:
        echo "<div>div2</div>";
        break;
    case 2:
        echo "<div>div3</div>";
        break;
}
?>

Share this post


Link to post
Share on other sites

vk.com например
для готового примера нужен сайт с несколькими страничками
аналоги jsfidle скорее всего не помогут ну или дадут представление того что я описал выше

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Member Statistics

    46,235
    Total Members
    3,128
    Most Online
    Bohdan_Barabash
    Newest Member
    Bohdan_Barabash
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.