Jump to content

Dynamic $page->next for infinite scroll


vadimmil
 Share

Recommended Posts

Hi!

I'm trying to implement infinite scroll (https://infinite-scroll.com) on my news site in development. I've done the main job, but here is the problem: I can get only one next page, using $page->next. The structure of the code is:

In DOM:

<p class="pagination">
                    <a class="pagination__next" href="<?php
                    $next_page = $page->next;
                    echo "$next_page->url";
                    ?>"></a>
                </p>

in Jquery:

$('.article-feed').infiniteScroll({
    checkLastPage: true,
    path: '.pagination__next',
    append: '.article',
    hideNav: '.pagination__next',
    history: 'push',
    historyTitle: true,
    debug: true
});

So Jquery takes url from DOM element with the class .pagination__next. Then it loads the page with this url. But after that it stuck, because on page 2 of infinite scroll the $page->next method returns the same url. I understand, that I should somehow get the url from $page->next method dynamically, but I just don't know how to do it.

Yeah, I know, 'don't do infinite scroll, if your don't know how to', but, may be, someone can give me any hints?

Link to comment
Share on other sites

Yes, I grabbed the parent div of the articles div that contained the prev-next links too. This way the Load more button could trigger the right Next link.

I can share the jQuery snippet though it's WP-specific and currently has no history feature. Plus the Load more needs manual click so you'd have to implement a check on scroll if you need it to automatically load next posts.

Link to comment
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
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...